@ntbjs/react-components 1.2.0-rc.40 → 1.2.0-rc.42

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 (9) hide show
  1. package/{AssetGallery-c19da75c.js → AssetGallery-57bd6815.js} +38 -25
  2. package/{Instructions-5ebac5f9.js → Instructions-b1311846.js} +1 -1
  3. package/{TextArea-ff90b757.js → TextArea-09b0d7e4.js} +32 -36
  4. package/inputs/TextArea/index.js +1 -1
  5. package/inputs/index.js +1 -1
  6. package/package.json +1 -1
  7. package/widgets/AssetGallery/index.js +2 -2
  8. package/widgets/Instructions/index.js +2 -2
  9. package/widgets/index.js +3 -3
package/{AssetGallery-c19da75c.js → AssetGallery-57bd6815.js} RENAMED
@@ -24,7 +24,7 @@ require('./CompactStarRating-1aedbcf4.js');
24
24
  require('./CompactTextInput-c40ff109.js');
25
25
  require('./MultiSelect-4b8d3d0d.js');
26
26
  require('./Radio-32d0513a.js');
27
- require('./TextArea-ff90b757.js');
27
+ require('./TextArea-09b0d7e4.js');
28
28
  require('./TextInput-0d109708.js');
29
29
  require('./Switch-4a41585f.js');
30
30
  var ContextMenu = require('./ContextMenu-4ec3d9f3.js');
@@ -294,7 +294,7 @@ SummaryCard.defaultProps = {
294
294
  activeSummaryCard: false
295
295
  };
296
296
 
297
- 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;
297
+ 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, _templateObject27;
298
298
  var AssetGalleryWrapper$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$1 || (_templateObject$1 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n"])), function (props) {
299
299
  return props.disabled && styled.css(_templateObject2$1 || (_templateObject2$1 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
300
300
  });
@@ -313,32 +313,34 @@ var AssetGalleryCompactCard$2 = styled__default['default'].div.attrs(defaultThem
313
313
  }, function (props) {
314
314
  return props.extendedSelectMode && styled.css(_templateObject5$1 || (_templateObject5$1 = defaultTheme._taggedTemplateLiteral(["\n cursor: pointer;\n "])));
315
315
  });
316
- var Figure$1 = styled__default['default'].figure(_templateObject6$1 || (_templateObject6$1 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n margin: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n .lazy-load-image-background {\n display: block !important;\n }\n\n img,\n video,\n .audio {\n display: block;\n height: 100%;\n width: 100%;\n ", "\n }\n\n .audio {\n display: flex;\n\n justify-content: center;\n svg {\n width: 25%;\n }\n }\n"])), function (props) {
317
- return props.hasHeightAndWidth ? styled.css(_templateObject7$1 || (_templateObject7$1 = defaultTheme._taggedTemplateLiteral(["\n object-fit: cover;\n "]))) : styled.css(_templateObject8$1 || (_templateObject8$1 = defaultTheme._taggedTemplateLiteral(["\n object-fit: contain;\n "])));
316
+ var Figure$1 = styled__default['default'].figure(_templateObject6$1 || (_templateObject6$1 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: center;\n align-items: center;\n position: relative;\n margin: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n .lazy-load-image-background {\n display: block !important;\n }\n\n video {\n ", "\n }\n\n img {\n display: block;\n height: 100%;\n width: 100%;\n ", "\n }\n"])), function (props) {
317
+ return !props.hasHeightAndWidth && styled.css(_templateObject7$1 || (_templateObject7$1 = defaultTheme._taggedTemplateLiteral(["\n width: 31.6% !important;\n "])));
318
+ }, function (props) {
319
+ return props.hasHeightAndWidth ? styled.css(_templateObject8$1 || (_templateObject8$1 = defaultTheme._taggedTemplateLiteral(["\n object-fit: cover;\n "]))) : styled.css(_templateObject9$1 || (_templateObject9$1 = defaultTheme._taggedTemplateLiteral(["\n object-fit: contain;\n "])));
318
320
  });
319
- var FigureOverlayBackdrop$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9$1 || (_templateObject9$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n inset: 0;\n opacity: ", ";\n background-color: ", ";\n"])), function (props) {
321
+ var FigureOverlayBackdrop$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10$1 || (_templateObject10$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n inset: 0;\n opacity: ", ";\n background-color: ", ";\n"])), function (props) {
320
322
  return props.selected ? 0.6 : 0;
321
323
  }, function (props) {
322
324
  return props.selected ? '#ACCEF7' : 'transparent';
323
325
  });
324
- var Overlay$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10$1 || (_templateObject10$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n"])));
325
- var OverlayBackdrop$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11$1 || (_templateObject11$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n opacity: 0;\n transition: opacity 220ms;\n\n ", "\n ", "\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
326
- return !props.selected ? styled.css(_templateObject12$1 || (_templateObject12$1 = defaultTheme._taggedTemplateLiteral(["\n background: radial-gradient(\n ellipse at center,\n rgba(0, 0, 0, 0.3) 27%,\n rgba(0, 0, 0, 0.5) 60%,\n rgba(0, 0, 0, 0.7) 90%\n );\n "]))) : null;
326
+ var Overlay$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11$1 || (_templateObject11$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n"])));
327
+ var OverlayBackdrop$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject12$1 || (_templateObject12$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n opacity: 0;\n transition: opacity 220ms;\n\n ", "\n ", "\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
328
+ return !props.selected ? styled.css(_templateObject13$1 || (_templateObject13$1 = defaultTheme._taggedTemplateLiteral(["\n background: radial-gradient(\n ellipse at center,\n rgba(0, 0, 0, 0.3) 27%,\n rgba(0, 0, 0, 0.5) 60%,\n rgba(0, 0, 0, 0.7) 90%\n );\n "]))) : null;
327
329
  }, function (props) {
328
- return (props.selected || props.softSelected) && styled.css(_templateObject13$1 || (_templateObject13$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n "])));
330
+ return (props.selected || props.softSelected) && styled.css(_templateObject14$1 || (_templateObject14$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n "])));
329
331
  }, Overlay$1);
330
- var OverlayInfo$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject14$1 || (_templateObject14$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 15px 12px 10px;\n color: ", ";\n"])), function (props) {
332
+ var OverlayInfo$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject15$1 || (_templateObject15$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 15px 12px 10px;\n color: ", ";\n"])), function (props) {
331
333
  return props.theme.getColor('gray-100');
332
334
  });
333
- var OverlayCompleted = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject15$1 || (_templateObject15$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border: 3px solid;\n ", ";\n"])), function (props) {
335
+ var OverlayCompleted = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject16$1 || (_templateObject16$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border: 3px solid;\n ", ";\n"])), function (props) {
334
336
  if (props.softSelected) return null;
335
337
  return props.theme.themeProp('border-color', props.theme.getColor('emerald-500'), polished.rgba(props.theme.getColor('emerald-500'), 0.7));
336
338
  });
337
- var OverlayHasError = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject16$1 || (_templateObject16$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border: 3px solid;\n ", "\n"])), function (props) {
339
+ var OverlayHasError = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject17$1 || (_templateObject17$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border: 3px solid;\n ", "\n"])), function (props) {
338
340
  if (props.softSelected) return null;
339
341
  return props.theme.themeProp('border-color', props.theme.getColor('red-600'), polished.rgba(props.theme.getColor('red-500'), 0.7));
340
342
  });
341
- var OverlaySelected$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject17$1 || (_templateObject17$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border-style: solid;\n border-width: 3px;\n\n ", ";\n"])), function (props) {
343
+ var OverlaySelected$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject18$1 || (_templateObject18$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border-style: solid;\n border-width: 3px;\n\n ", ";\n"])), function (props) {
342
344
  if (props.softSelected) {
343
345
  return props.theme.themeProp('border-color', polished.rgba(props.theme.getColor('gray-100'), 0.5), polished.rgba(props.theme.getColor('gray-700'), 0.5));
344
346
  }
@@ -349,31 +351,31 @@ var OverlaySelected$1 = styled__default['default'].div.attrs(defaultTheme.applyD
349
351
 
350
352
  return props.theme.themeProp('border-color', 'transparent', 'transparent');
351
353
  });
352
- var OverlayInfoTop$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject18$1 || (_templateObject18$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n padding: 8px;\n display: flex;\n"])));
353
- var OverlayInfoTopActions$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject19$1 || (_templateObject19$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n right: 0;\n padding: 4px;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n transition: opacity 220ms;\n z-index: 99999;\n ", "\n\n opacity: ", ";\n"])), function (props) {
354
+ var OverlayInfoTop$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject19$1 || (_templateObject19$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n padding: 8px;\n display: flex;\n"])));
355
+ var OverlayInfoTopActions$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject20$1 || (_templateObject20$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n right: 0;\n padding: 4px;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n transition: opacity 220ms;\n z-index: 99999;\n ", "\n\n opacity: ", ";\n"])), function (props) {
354
356
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-700'));
355
357
  }, function (props) {
356
358
  return props.isOverlayHovered ? 1 : 0;
357
359
  });
358
- var OverlayInfoTopVersions$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject20$1 || (_templateObject20$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n display: ", ";\n\n ", ":hover & {\n opacity: 0;\n }\n"])), function (props) {
360
+ var OverlayInfoTopVersions$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject21$1 || (_templateObject21$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n display: ", ";\n\n ", ":hover & {\n opacity: 0;\n }\n"])), function (props) {
359
361
  return props !== null && props !== void 0 && props.collapseExtraInfo ? 'none' : 'block';
360
362
  }, Overlay$1);
361
- var OverlayInfoTopWarning$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject21$1 || (_templateObject21$1 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n height: 24px;\n width: 24px;\n border-radius: 50%;\n box-sizing: border-box;\n padding: ", ";\n background-color: ", ";\n opacity: 1;\n\n svg {\n width: 100%;\n color: ", ";\n }\n\n ", ":hover & {\n opacity: 0;\n }\n"])), function (props) {
363
+ var OverlayInfoTopWarning$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject22$1 || (_templateObject22$1 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n height: 24px;\n width: 24px;\n border-radius: 50%;\n box-sizing: border-box;\n padding: ", ";\n background-color: ", ";\n opacity: 1;\n\n svg {\n width: 100%;\n color: ", ";\n }\n\n ", ":hover & {\n opacity: 0;\n }\n"])), function (props) {
362
364
  return props.type === 'error' ? 0 : '3px 4px';
363
365
  }, function (props) {
364
366
  return props.type === 'error' ? props.theme.getColor('red-500') : props.theme.getColor('gray-100');
365
367
  }, function (props) {
366
368
  return props.type === 'error' ? props.theme.getColor('gray-100') : props.theme.getColor('gray-700');
367
369
  }, Overlay$1);
368
- var OverlayInfoBottom$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject22$1 || (_templateObject22$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n padding: 8px;\n display: flex;\n"])));
369
- var OverlayInfoBottomSelectButton$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject23$1 || (_templateObject23$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: ", ";\n flex-shrink: 0;\n cursor: pointer;\n transition: opacity 220ms;\n height: 24px;\n\n > svg {\n width: 24px;\n height: 24px;\n transition: opacity 120ms;\n opacity: ", ";\n }\n\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
370
+ var OverlayInfoBottom$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject23$1 || (_templateObject23$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n padding: 8px;\n display: flex;\n"])));
371
+ var OverlayInfoBottomSelectButton$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject24$1 || (_templateObject24$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: ", ";\n flex-shrink: 0;\n cursor: pointer;\n transition: opacity 220ms;\n height: 24px;\n\n > svg {\n width: 24px;\n height: 24px;\n transition: opacity 120ms;\n opacity: ", ";\n }\n\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
370
372
  return props.selected ? 1 : 0;
371
373
  }, function (props) {
372
374
  return props.selected ? 1 : 0.5;
373
375
  }, Overlay$1);
374
- var OverlayInfoBottomMediaIcon$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject24$1 || (_templateObject24$1 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n opacity: 1;\n\n ", ":hover & {\n opacity: 0;\n }\n"])), Overlay$1);
375
- var ConsumerDefinedOverlay$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject25$1 || (_templateObject25$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n"])));
376
- var Fragment$1 = styled__default['default'].div(_templateObject26$1 || (_templateObject26$1 = defaultTheme._taggedTemplateLiteral(["\n margin: 4px;\n"])));
376
+ var OverlayInfoBottomMediaIcon$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject25$1 || (_templateObject25$1 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n opacity: 1;\n\n ", ":hover & {\n opacity: 0;\n }\n"])), Overlay$1);
377
+ var ConsumerDefinedOverlay$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject26$1 || (_templateObject26$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n"])));
378
+ var Fragment$1 = styled__default['default'].div(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n margin: 4px;\n"])));
377
379
 
378
380
  var ComputedRootComponent$1 = function ComputedRootComponent(_ref) {
379
381
  var component = _ref.component,
@@ -473,7 +475,8 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
473
475
  softSelected = props.softSelected,
474
476
  component = props.component,
475
477
  scrollPosition = props.scrollPosition,
476
- collapseExtraInfo = props.collapseExtraInfo;
478
+ collapseExtraInfo = props.collapseExtraInfo,
479
+ thumbnailMaxHeight = props.thumbnailMaxHeight;
477
480
 
478
481
  var _React$useState = React__default['default'].useState(false),
479
482
  _React$useState2 = defaultTheme._slicedToArray(_React$useState, 2),
@@ -485,6 +488,14 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
485
488
  openedSubActions = _React$useState4[0],
486
489
  updateOpenedSubActions = _React$useState4[1];
487
490
 
491
+ var _React$useState5 = React__default['default'].useState(),
492
+ _React$useState6 = defaultTheme._slicedToArray(_React$useState5, 2),
493
+ maxHeight = _React$useState6[0],
494
+ setMaxHeight = _React$useState6[1];
495
+
496
+ React.useEffect(function () {
497
+ setMaxHeight(thumbnailMaxHeight);
498
+ }, [thumbnailMaxHeight]);
488
499
  React.useEffect(function () {
489
500
  var _asset$actions;
490
501
 
@@ -643,7 +654,7 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
643
654
  }, React__default['default'].createElement("div", {
644
655
  className: "audio",
645
656
  style: {
646
- height: '100%'
657
+ height: maxHeight
647
658
  }
648
659
  }, React__default['default'].createElement(SvgHeadset, null)));
649
660
  } else {
@@ -808,6 +819,7 @@ AssetGalleryCompactCard.propTypes = process.env.NODE_ENV !== "production" ? {
808
819
  softSelected: defaultTheme.PropTypes.bool.isRequired,
809
820
  component: defaultTheme.PropTypes.func,
810
821
  scrollPosition: defaultTheme.PropTypes.number,
822
+ thumbnailMaxHeight: defaultTheme.PropTypes.number,
811
823
  collapseExtraInfo: defaultTheme.PropTypes.bool
812
824
  } : {};
813
825
  AssetGalleryCompactCard.defaultProps = {};
@@ -1709,7 +1721,7 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
1709
1721
  style: {
1710
1722
  transform: "translate3d(".concat(asset.layout.translateX, "px, ").concat(asset.layout.translateY, "px, 0)"),
1711
1723
  width: "".concat(asset.layout.width, "px"),
1712
- height: 'auto'
1724
+ height: "".concat(asset.layout.height, "px")
1713
1725
  }
1714
1726
  }, viewMode === 'grid' ? React__default['default'].createElement(AssetGalleryGridCard$1, {
1715
1727
  asset: asset,
@@ -1731,6 +1743,7 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
1731
1743
  onAssetSelected: onAssetSelected,
1732
1744
  onAssetUnselected: onAssetUnselected,
1733
1745
  softSelected: softSelectedAssetKey === asset.key,
1746
+ thumbnailMaxHeight: "".concat(asset.layout.height, "px"),
1734
1747
  component: component
1735
1748
  })));
1736
1749
  })));
package/{Instructions-5ebac5f9.js → Instructions-b1311846.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-87c8c7e7.js');
8
- var TextArea = require('./TextArea-ff90b757.js');
8
+ var TextArea = require('./TextArea-09b0d7e4.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-ff90b757.js → TextArea-09b0d7e4.js} RENAMED
@@ -19,7 +19,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
19
19
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
20
20
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
21
21
 
22
- 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, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47, _templateObject48;
22
+ 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, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47;
23
23
  var fadeInCheck = styled.keyframes(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 0\n }\n to {\n opacity: 1\n }\n"])));
24
24
  var fadeOutCheck = styled.keyframes(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 1\n }\n to {\n opacity: 0\n }\n"])));
25
25
  var activeLabel = styled.css(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n font-size: 0.75rem;\n padding: 0 3px;\n top: -7px;\n letter-spacing: 0.03em;\n left: 8px !important;\n opacity: 1 !important;\n"])));
@@ -35,7 +35,7 @@ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.apply
35
35
  }, function (props) {
36
36
  return props.disabled && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
37
37
  });
38
- var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 5px 10px;\n resize: vertical;\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n border: 1px solid;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n ", "\n\n transition: height 550ms ease-in-out; border-color 350ms;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n \n ", "\n \n ", "\n\n ", "\n \n ", "\n\n ", "\n\n ", " \n\n ", " \n\n ", " \n \n\n ", " \n \n ", "\n\n ", "\n\n ", "\n\n ", " \n\n ", "\n \n \n ", "\n\n ", "\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n \n ", "\n\n &&:hover:not(:focus) {\n ", ";\n\n ", ";\n\n ", "\n\n ", ";\n\n \n ", "; \n\n\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n &&:focus {\n outline: none;\n ", "\n\n ", ";\n\n \n ", " \n \n ", "\n\n }\n\n &&:not(:hover):not(:focus) {\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
38
+ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 5px 10px;\n resize: vertical;\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n border: 1px solid;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n ", "\n\n transition: height 550ms ease-in-out; border-color 350ms;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n \n ", "\n \n ", "\n\n ", "\n \n ", "\n\n ", "\n\n ", " \n\n ", " \n\n ", " \n \n\n ", " \n \n ", "\n\n ", "\n\n ", " \n\n ", "\n \n \n ", "\n\n ", "\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n \n ", "\n\n &&:hover:not(:focus) {\n ", ";\n\n ", ";\n\n ", "\n\n ", ";\n\n \n ", "; \n\n\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n &&:focus {\n outline: none;\n ", "\n\n ", ";\n\n \n ", " \n \n ", "\n\n }\n\n &&:not(:hover):not(:focus) {\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
39
39
  return props.padding === 'small' && styled.css(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n padding: 5px 10px;\n "])));
40
40
  }, function (props) {
41
41
  return props.padding === 'medium' && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n padding: 13px 15px;\n "])));
@@ -70,31 +70,27 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
70
70
  }, function (props) {
71
71
  return props.type === 'warning' && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01', '#FFFDE8'), props.theme.themeProp('border-color', '#634E01 ', '#FFFDE8'));
72
72
  }, function (props) {
73
- return props.type === 'instructions-warning' && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01', '#F4E21E'), props.theme.themeProp('border-color', '#634E01 ', '#F4E21E'));
73
+ return props.type === 'instructions-warning' && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01', '#FFF36C'), props.theme.themeProp('border-color', '#634E01 ', '#FFF36C'));
74
74
  }, function (props) {
75
75
  return props.type === 'error' && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#7f1b1b', '#FBEAE6'), props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6'));
76
76
  }, function (props) {
77
77
  return props.noBorder && props.type === 'instructions-warning' && styled.css(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
78
- return props.theme.themeProp('border-color', '#634E01', '#F4E21E');
78
+ return props.theme.themeProp('border-color', '#634E01', '#FFF36C');
79
79
  });
80
80
  }, function (props) {
81
- return props.noBorder && props.type === 'warning' && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
81
+ return props.noBorder && props.type === 'warning' && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
82
82
  return props.theme.themeProp('border-color', '#634E01', '#FFFDE8');
83
83
  });
84
84
  }, function (props) {
85
- return props.noBorder && props.type === 'instructions-warning' && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
86
- return props.theme.themeProp('border-color', '#634E01', '#F4E21E');
87
- });
88
- }, function (props) {
89
- return props.noBorder && props.type === 'error' && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
85
+ return props.noBorder && props.type === 'error' && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
90
86
  return props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6');
91
87
  });
92
88
  }, function (props) {
93
- return props.type === 'warning-border' && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
89
+ return props.type === 'warning-border' && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
94
90
  }, function (props) {
95
- return props.type === 'error-border' && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
91
+ return props.type === 'error-border' && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
96
92
  }, function (props) {
97
- return props.lightBackground && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover {\n ", "\n }\n "])), props.theme.themeProp('background', '#FFFDDE', '#fffde8'), props.theme.themeProp('color', props.theme.getColor('gray-900'), props.theme.getColor('gray-900')), props.theme.themeProp('background', 'white', 'white'));
93
+ return props.lightBackground && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover {\n ", "\n }\n "])), props.theme.themeProp('background', '#FFFDDE', '#fffde8'), props.theme.themeProp('color', props.theme.getColor('gray-900'), props.theme.getColor('gray-900')), props.theme.themeProp('background', 'white', 'white'));
98
94
  }, function (props) {
99
95
  return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
100
96
  }, function (props) {
@@ -104,14 +100,14 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
104
100
  }, function (props) {
105
101
  return props.edit && props.type === 'instructions-warning' && props.theme.themeProp('background', '#AD8800 ', '#FFF3A7');
106
102
  }, function (props) {
107
- return props.hasIcon && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-right: 25px;\n "])));
103
+ return props.hasIcon && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-right: 25px;\n "])));
108
104
  }, function (props) {
109
105
  return !props.readOnly && !props.disabled && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
110
106
  }, function (props) {
111
- return props.type === 'instructions-warning' && props.theme.themeProp('background', '#806403', '#FFFDE8');
107
+ return props.type === 'instructions-warning' && props.theme.themeProp('background', '#806403', '#F4E21E');
112
108
  }, function (props) {
113
- return props.noBorder && props.type === 'instructions-warning' && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
114
- return props.theme.themeProp('border-color', '#806403', '#FFFDE8');
109
+ return props.noBorder && props.type === 'instructions-warning' && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
110
+ return props.theme.themeProp('border-color', '#806403', '#F4E21E');
115
111
  });
116
112
  }, function (props) {
117
113
  return props.type === 'warning' && props.theme.themeProp('background', '#806403', '#FFFEBF');
@@ -120,7 +116,7 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
120
116
  }, function (props) {
121
117
  return props.noBorder && !props.readOnly && props.type != 'warning' && props.type != 'error' && props.type != 'instructions-warning' ? props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')) : 'background: transparent';
122
118
  }, InputIconContainer, function (props) {
123
- return props.type === 'success' && styled.css(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
119
+ return props.type === 'success' && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
124
120
  }, function (props) {
125
121
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'), 1);
126
122
  }, function (props) {
@@ -130,11 +126,11 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
130
126
  }, function (props) {
131
127
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
132
128
  }, function (props) {
133
- return props.type === 'warning' && styled.css(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
129
+ return props.type === 'warning' && styled.css(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
134
130
  return props.theme.themeProp('border-color', '#F4E21E', '#F4E21E');
135
131
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
136
132
  }, function (props) {
137
- return props.type === 'error' && styled.css(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
133
+ return props.type === 'error' && styled.css(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
138
134
  return props.theme.themeProp('border-color', '#D83018', '#D83018');
139
135
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
140
136
  }, function (props) {
@@ -144,48 +140,48 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
144
140
  }, function (props) {
145
141
  return props.edit && props.type === 'instructions-warning' && props.theme.themeProp('background', '#AD8800 ', '#FFF3A7');
146
142
  });
147
- var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 13px;\n left: 11px;\n line-height: 1.2;\n font-size: 0.875rem;\n transition: all 150ms;\n margin-botton: 50px;\n\n ", ";\n\n ", "\n\n ", "\n\n ", "\n content: \"\";\n\n ", "\n"])), placeholderBaseStyle, function (props) {
143
+ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 13px;\n left: 11px;\n line-height: 1.2;\n font-size: 0.875rem;\n transition: all 150ms;\n margin-botton: 50px;\n\n ", ";\n\n ", "\n\n ", "\n\n ", "\n content: \"\";\n\n ", "\n"])), placeholderBaseStyle, function (props) {
148
144
  return props.theme.themeProp('background', "linear-gradient(0deg, ".concat(props.theme.getColor('gray-900'), " calc(50% + 1px), transparent 50%)"), "linear-gradient(0deg, ".concat(props.theme.getColor('white'), " calc(50% + 1px), transparent 50%)"));
149
145
  }, function (props) {
150
- return !props.inputIsEmpty && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), activeLabel);
146
+ return !props.inputIsEmpty && styled.css(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), activeLabel);
151
147
  }, function (props) {
152
- return props.hasPlaceholder && styled.css(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n "])), activeLabel);
148
+ return props.hasPlaceholder && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n "])), activeLabel);
153
149
  }, function (props) {
154
- return props.hasIcon && styled.css(_templateObject36 || (_templateObject36 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
150
+ return props.hasIcon && styled.css(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
155
151
  });
156
- var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n height: 2.625rem;\n display: flex;\n padding: 0 10px;\n\n svg {\n width: 15px;\n opacity: 0.6;\n transition: opacity 250ms;\n }\n"])));
157
- var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n height: 2.625rem;\n display: flex;\n padding: 0 10px 0 30px;\n svg {\n width: 15px;\n opacity: 0.6;\n transition: opacity 250ms;\n margin-top: -3px;\n ", "\n }\n"])), function (props) {
152
+ var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n height: 2.625rem;\n display: flex;\n padding: 0 10px;\n\n svg {\n width: 15px;\n opacity: 0.6;\n transition: opacity 250ms;\n }\n"])));
153
+ var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n height: 2.625rem;\n display: flex;\n padding: 0 10px 0 30px;\n svg {\n width: 15px;\n opacity: 0.6;\n transition: opacity 250ms;\n margin-top: -3px;\n ", "\n }\n"])), function (props) {
158
154
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-600'));
159
155
  });
160
- var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n\n ", "\n\n ", "\n\n &:focus-within {\n ", " {\n ", ";\n }\n\n ", " {\n svg {\n opacity: 1;\n }\n }\n }\n\n ", ":not(:placeholder-shown) + ", " {\n ", ";\n ", "\n }\n }\n"])), function (props) {
161
- return props.readOnly && styled.css(_templateObject40 || (_templateObject40 = defaultTheme._taggedTemplateLiteral(["\n pointer-events: none;\n "])));
156
+ var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n\n ", "\n\n ", "\n\n &:focus-within {\n ", " {\n ", ";\n }\n\n ", " {\n svg {\n opacity: 1;\n }\n }\n }\n\n ", ":not(:placeholder-shown) + ", " {\n ", ";\n ", "\n }\n }\n"])), function (props) {
157
+ return props.readOnly && styled.css(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n pointer-events: none;\n "])));
162
158
  }, function (props) {
163
- return props.disabled && styled.css(_templateObject41 || (_templateObject41 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
159
+ return props.disabled && styled.css(_templateObject40 || (_templateObject40 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
164
160
  }, TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
165
161
  return props.type === 'error' && props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500'));
166
162
  });
167
- var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject42 || (_templateObject42 = defaultTheme._taggedTemplateLiteral(["\n margin: 8px 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ", ";\n\n ", "\n\n ", "\n"])), function (props) {
163
+ var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject41 || (_templateObject41 = defaultTheme._taggedTemplateLiteral(["\n margin: 8px 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ", ";\n\n ", "\n\n ", "\n"])), function (props) {
168
164
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
169
165
  }, function (props) {
170
- return (props.type === 'warning-border' || props.type === 'warning') && styled.css(_templateObject43 || (_templateObject43 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
166
+ return (props.type === 'warning-border' || props.type === 'warning') && styled.css(_templateObject42 || (_templateObject42 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
171
167
  }, function (props) {
172
- return (props.type === 'error-border' || props.type === 'error') && styled.css(_templateObject44 || (_templateObject44 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
168
+ return (props.type === 'error-border' || props.type === 'error') && styled.css(_templateObject43 || (_templateObject43 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
173
169
  });
174
- var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject45 || (_templateObject45 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n position: absolute;\n margin-top: -35px;\n margin-left: 5px;\n width: 15px;\n height: 15px;\n padding: 5px;\n ", "\n\n > svg {\n width: 15px;\n }\n"])), function (props) {
170
+ var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject44 || (_templateObject44 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n position: absolute;\n margin-top: -35px;\n margin-left: 5px;\n width: 15px;\n height: 15px;\n padding: 5px;\n ", "\n\n > svg {\n width: 15px;\n }\n"])), function (props) {
175
171
  return props.fadeIn ? 0 : 1;
176
172
  }, function (props) {
177
173
  return props.fadeIn ? fadeOutCheck : fadeInCheck;
178
174
  }, function (props) {
179
175
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
180
176
  });
181
- var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject46 || (_templateObject46 = defaultTheme._taggedTemplateLiteral(["\n margin-top: -18px;\n margin-bottom: 0;\n display: block;\n position: absolute;\n font-size: 0.875rem;\n cursor: pointer;\n padding: 2px 10px;\n margin-right: 10px;\n margin-top: -26px;\n ", "\n transition: margin-top 550ms ease-in-out;\n -webkit-mask-image: linear-gradient(180deg, transparent 1px, white 7px);\n ", "\n\n ", ";\n\n ", "\n"])), function (props) {
182
- return props.expanded && styled.css(_templateObject47 || (_templateObject47 = defaultTheme._taggedTemplateLiteral(["\n margin-top: 0px;\n "])));
177
+ var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject45 || (_templateObject45 = defaultTheme._taggedTemplateLiteral(["\n margin-top: -18px;\n margin-bottom: 0;\n display: block;\n position: absolute;\n font-size: 0.875rem;\n cursor: pointer;\n padding: 2px 10px;\n margin-right: 10px;\n margin-top: -26px;\n ", "\n transition: margin-top 550ms ease-in-out;\n -webkit-mask-image: linear-gradient(180deg, transparent 1px, white 7px);\n ", "\n\n ", ";\n\n ", "\n"])), function (props) {
178
+ return props.expanded && styled.css(_templateObject46 || (_templateObject46 = defaultTheme._taggedTemplateLiteral(["\n margin-top: 0px;\n "])));
183
179
  }, function (props) {
184
180
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
185
181
  }, function (props) {
186
182
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('emerald-500'));
187
183
  }, function (props) {
188
- return props.type === 'error' && styled.css(_templateObject48 || (_templateObject48 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
184
+ return props.type === 'error' && styled.css(_templateObject47 || (_templateObject47 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
189
185
  });
190
186
 
191
187
  var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forwardedRef) {
package/inputs/TextArea/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-ff90b757.js');
3
+ var TextArea = require('../../TextArea-09b0d7e4.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('react');
package/inputs/index.js CHANGED
@@ -10,7 +10,7 @@ var CompactStarRating = require('../CompactStarRating-1aedbcf4.js');
10
10
  var CompactTextInput = require('../CompactTextInput-c40ff109.js');
11
11
  var MultiSelect = require('../MultiSelect-4b8d3d0d.js');
12
12
  var Radio = require('../Radio-32d0513a.js');
13
- var TextArea = require('../TextArea-ff90b757.js');
13
+ var TextArea = require('../TextArea-09b0d7e4.js');
14
14
  var TextInput = require('../TextInput-0d109708.js');
15
15
  var Switch = require('../Switch-4a41585f.js');
16
16
  var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-eeb5dcef.js');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.2.0-rc.40",
3
+ "version": "1.2.0-rc.42",
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,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var AssetGallery = require('../../AssetGallery-c19da75c.js');
3
+ var AssetGallery = require('../../AssetGallery-57bd6815.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -41,7 +41,7 @@ require('../../CompactStarRating-1aedbcf4.js');
41
41
  require('../../CompactTextInput-c40ff109.js');
42
42
  require('../../MultiSelect-4b8d3d0d.js');
43
43
  require('../../Radio-32d0513a.js');
44
- require('../../TextArea-ff90b757.js');
44
+ require('../../TextArea-09b0d7e4.js');
45
45
  require('../../Switch-4a41585f.js');
46
46
  require('../../ContextMenuItem-1fe17ed5.js');
47
47
 
package/widgets/Instructions/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-5ebac5f9.js');
3
+ var Instructions = require('../../Instructions-b1311846.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -25,7 +25,7 @@ require('../../react-select-creatable.esm-2f23d6c6.js');
25
25
  require('react-dom');
26
26
  require('../../close-ebf2f3cf.js');
27
27
  require('../../expand-more-94585605.js');
28
- require('../../TextArea-ff90b757.js');
28
+ require('../../TextArea-09b0d7e4.js');
29
29
  require('../../useMergedRefs-b6d2f8fc.js');
30
30
  require('../../edit-note-c47d292e.js');
31
31
 
package/widgets/index.js CHANGED
@@ -2,10 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var AssetGallery = require('../AssetGallery-c19da75c.js');
5
+ var AssetGallery = require('../AssetGallery-57bd6815.js');
6
6
  var ContextMenu = require('../ContextMenu-4ec3d9f3.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-c28715f7.js');
8
- var Instructions = require('../Instructions-5ebac5f9.js');
8
+ var Instructions = require('../Instructions-b1311846.js');
9
9
  require('../defaultTheme-ea44e34a.js');
10
10
  require('styled-components');
11
11
  require('lodash');
@@ -45,7 +45,7 @@ require('../CompactStarRating-1aedbcf4.js');
45
45
  require('../CompactTextInput-c40ff109.js');
46
46
  require('../MultiSelect-4b8d3d0d.js');
47
47
  require('../Radio-32d0513a.js');
48
- require('../TextArea-ff90b757.js');
48
+ require('../TextArea-09b0d7e4.js');
49
49
  require('../Switch-4a41585f.js');
50
50
  require('../ContextMenuItem-1fe17ed5.js');
51
51