@ntbjs/react-components 1.1.0-beta.89 → 1.1.0-beta.90

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 (11) hide show
  1. package/{AssetGallery-ad31621f.js → AssetGallery-fa59b3c7.js} +2 -2
  2. package/{CompactAutocompleteSelect-5ee8443f.js → CompactAutocompleteSelect-45b12179.js} +1 -1
  3. package/{Instructions-c16a0832.js → Instructions-4041b686.js} +7 -10
  4. package/{TextArea-baf49a63.js → TextArea-14b4864b.js} +59 -78
  5. package/inputs/CompactAutocompleteSelect/index.js +1 -1
  6. package/inputs/TextArea/index.js +1 -1
  7. package/inputs/index.js +2 -2
  8. package/package.json +1 -1
  9. package/widgets/AssetGallery/index.js +3 -3
  10. package/widgets/Instructions/index.js +3 -3
  11. package/widgets/index.js +4 -4
package/{AssetGallery-ad31621f.js → AssetGallery-fa59b3c7.js} RENAMED
@@ -9,12 +9,12 @@ var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
9
9
  var ActionButton = require('./ActionButton-c3f5ed94.js');
10
10
  require('./Button-432f87c6.js');
11
11
  require('./Checkbox-85394137.js');
12
- require('./CompactAutocompleteSelect-5ee8443f.js');
12
+ require('./CompactAutocompleteSelect-45b12179.js');
13
13
  require('./CompactStarRating-de1bcfe9.js');
14
14
  require('./CompactTextInput-480f59cc.js');
15
15
  require('./MultiSelect-01a257b8.js');
16
16
  require('./Radio-c811ce4a.js');
17
- require('./TextArea-baf49a63.js');
17
+ require('./TextArea-14b4864b.js');
18
18
  require('./Switch-3ac11c97.js');
19
19
  require('./Alert-3e4f8be1.js');
20
20
  require('./Badge-9bcebe96.js');
package/{CompactAutocompleteSelect-5ee8443f.js → CompactAutocompleteSelect-45b12179.js} RENAMED
@@ -73,7 +73,7 @@ var AutocompletSelect = styled__default['default'](Select__default['default']).a
73
73
  var AutocompletCreatableSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n"])), sharedStyle, function (props) {
74
74
  return props.disabled && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
75
75
  });
76
- var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n\n height: 22px;\n min-height: 22px;\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 2px 0 10px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n ", "\n\n ", ";\n ", ";\n\n ", "\n ", "\n ", "\n }\n\n & .dropdown-indicator {\n display: none;\n }\n\n &:hover .dropdown-indicator {\n display: flex;\n }\n\n &&:hover {\n border-color: transparent;\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
76
+ var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n\n height: 22px;\n min-height: 22px;\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 2.5px 0 8px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n ", "\n\n ", ";\n ", ";\n\n ", "\n ", "\n ", "\n }\n\n & .dropdown-indicator {\n display: none;\n }\n\n &:hover .dropdown-indicator {\n display: flex;\n }\n\n &&:hover {\n border-color: transparent;\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
77
77
  return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
78
78
  }, function (props) {
79
79
  return props.state && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n animation: ", " 0.5s ease-in-out;\n "])), function (props) {
package/{Instructions-c16a0832.js → Instructions-4041b686.js} RENAMED
@@ -4,8 +4,8 @@ var defaultTheme = require('./defaultTheme-50f2b88f.js');
4
4
  var lodash = require('lodash');
5
5
  var React = require('react');
6
6
  var warningCircle = require('./warning-circle-24522402.js');
7
- var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-5ee8443f.js');
8
- var TextArea = require('./TextArea-baf49a63.js');
7
+ var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-45b12179.js');
8
+ var TextArea = require('./TextArea-14b4864b.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 }; }
@@ -45,13 +45,12 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
45
45
  loadingMessageFunc = _ref.loadingMessageFunc,
46
46
  placeholder = _ref.placeholder,
47
47
  state = _ref.state,
48
- editWarning = _ref.editWarning,
48
+ edit = _ref.edit,
49
49
  rows = _ref.rows,
50
50
  showMore = _ref.showMore,
51
51
  showMoreText = _ref.showMoreText,
52
52
  isExpanded = _ref.isExpanded,
53
- maxRows = _ref.maxRows,
54
- props = defaultTheme._objectWithoutProperties(_ref, ["clickToAdd", "customAddMessage", "selectedOption", "loadOptions", "readOnly", "disabled", "hidden", "name", "lightBackground", "autoSelect", "subscribeCurrentValue", "onChange", "onFocus", "onBlur", "onUpdateCallback", "availableOptions", "loadingMessageFunc", "placeholder", "state", "editWarning", "rows", "showMore", "showMoreText", "isExpanded", "maxRows"]);
53
+ props = defaultTheme._objectWithoutProperties(_ref, ["clickToAdd", "customAddMessage", "selectedOption", "loadOptions", "readOnly", "disabled", "hidden", "name", "lightBackground", "autoSelect", "subscribeCurrentValue", "onChange", "onFocus", "onBlur", "onUpdateCallback", "availableOptions", "loadingMessageFunc", "placeholder", "state", "edit", "rows", "showMore", "showMoreText", "isExpanded"]);
55
54
 
56
55
  var _useState = React.useState(false),
57
56
  _useState2 = defaultTheme._slicedToArray(_useState, 2),
@@ -195,8 +194,7 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
195
194
  disabled: disabled,
196
195
  name: name,
197
196
  isExpanded: isExpanded,
198
- maxRows: maxRows,
199
- editWarning: editWarning,
197
+ edit: edit,
200
198
  value: currentValue === null ? '' : currentValue,
201
199
  onFocus: onFocus,
202
200
  onChange: onChange,
@@ -212,7 +210,7 @@ Instructions.defaultProps = {
212
210
  lightBackground: false,
213
211
  autoSelect: true,
214
212
  hidden: false,
215
- editWarning: false,
213
+ edit: false,
216
214
  disabled: false,
217
215
  readOnly: false,
218
216
  state: ''
@@ -234,7 +232,7 @@ Instructions.propTypes = process.env.NODE_ENV !== "production" ? {
234
232
  showMoreText: defaultTheme.PropTypes.string,
235
233
  availableOptions: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.object),
236
234
  lightBackground: defaultTheme.PropTypes.bool,
237
- editWarning: defaultTheme.PropTypes.bool,
235
+ edit: defaultTheme.PropTypes.bool,
238
236
  options: defaultTheme.PropTypes.array,
239
237
  subscribeCurrentValue: defaultTheme.PropTypes.func,
240
238
  onChange: defaultTheme.PropTypes.func,
@@ -242,7 +240,6 @@ Instructions.propTypes = process.env.NODE_ENV !== "production" ? {
242
240
  onBlur: defaultTheme.PropTypes.func,
243
241
  onUpdateCallback: defaultTheme.PropTypes.func,
244
242
  state: defaultTheme.PropTypes.oneOf(['', 'error', 'error-border', 'warning', 'loading', 'success']),
245
- maxRows: defaultTheme.PropTypes.func,
246
243
  isExpanded: defaultTheme.PropTypes.func
247
244
  } : {};
248
245
 
package/{TextArea-baf49a63.js → TextArea-14b4864b.js} RENAMED
@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
12
12
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
13
13
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
14
14
 
15
- 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;
15
+ 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;
16
16
  var fadeInCheck = styled.keyframes(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 0\n }\n to {\n opacity: 1\n }\n"])));
17
17
  var fadeOutCheck = styled.keyframes(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 1\n }\n to {\n opacity: 0\n }\n"])));
18
18
  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"])));
@@ -27,7 +27,7 @@ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.apply
27
27
  return props.disabled && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
28
28
  });
29
29
  var Container = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral([""])));
30
- var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 13px 10px;\n resize: vertical;\n transition: height 0.3s ease;\n z-index: 0;\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n \n ", "\n ", "\n ", "\n border: 1px solid;\n ", "\n ", " \n ", "\n\n &&:hover:not(:focus) {\n ", ";\n }\n\n ", "\n\n ", " \n\n ", " \n ", "\n ", ";\n &&:hover:not(:focus) {\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n ", "\n ", "\n ", "\n\n ", "\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n &&:focus {\n outline: none;\n ", " ", ";\n }\n"])), function (props) {
30
+ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = 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 transition: height 0.3s ease;\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n border: 1px solid;\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 &&:hover:not(:focus) {\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n\n ", "\n ", "\n ", "\n\n ", "\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n &&:focus {\n outline: none;\n ", "\n\n ", ";\n\n ", "\n ", "\n }\n"])), function (props) {
31
31
  return props.theme.themeProp('color', 'white', 'black');
32
32
  }, function (props) {
33
33
  return props.disabled && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
@@ -52,29 +52,29 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
52
52
  }, function (props) {
53
53
  return !props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
54
54
  }, function (props) {
55
- return props.state === 'warning' && !props.editWarning && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n :focus {\n background: white !important;\n color: black !important;\n }\n &&:hover:not(:focus) {\n ", "\n ", "\n }\n &&:read-only:hover {\n ", "\n }\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400')), function (props) {
55
+ return props.state === 'warning' && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover:not(:focus) {\n ", "\n ", "\n }\n &&:read-only:hover {\n ", "\n }\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01 ', props.theme.getColor('signal-yellow-400')), function (props) {
56
56
  return props.disabled && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n "])));
57
57
  }, props.theme.themeProp('background', '#816600', '#F4E21E'), props.theme.themeProp('background', props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-400')));
58
58
  }, function (props) {
59
- return props.state === 'warning' && props.editWarning && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n ", "\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n ", "\n }\n &&:read-only:hover {\n ", "\n }\n "])), props.theme.themeProp('background', '#fffde8', '#fffde8'), props.theme.themeProp('background', '#fffebf', '#fffebf'), props.theme.themeProp('background', props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-400')));
59
+ return props.state === 'error' && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n background: ", " !important;\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n background: #f7d5d0 !important;\n }\n &&:read-only:hover {\n background: ", " !important;\n }\n "])), props.theme.getColor('red-200'), props.theme.getColor('red-200'));
60
60
  }, function (props) {
61
- return props.state === 'error' && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n background: ", " !important;\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n background: #f7d5d0 !important;\n }\n &&:read-only:hover {\n background: ", " !important;\n }\n "])), props.theme.getColor('red-200'), props.theme.getColor('red-200'));
61
+ return props.lightBackground && styled.css(_templateObject18 || (_templateObject18 = 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'));
62
62
  }, function (props) {
63
- return props.lightBackground && styled.css(_templateObject19 || (_templateObject19 = 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'));
63
+ return props.edit && !props.state === 'warning' && props.theme.themeProp('background', '#505050', '#eff1f4');
64
64
  }, function (props) {
65
- return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
65
+ return props.edit && props.state === 'warning' && props.theme.themeProp('background', '#AD8800', '#FFF3A7');
66
66
  }, function (props) {
67
67
  return props.noBorder && !props.readOnly && props.state != 'warning' ? props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')) : 'background: transparent';
68
68
  }, InputIconContainer, function (props) {
69
- return props.state === 'success' && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
69
+ return props.state === 'success' && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
70
70
  }, function (props) {
71
- return props.state === 'warning' && styled.css(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), props.theme.getColor('orange-500'));
71
+ return props.state === 'warning' && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), props.theme.getColor('orange-500'));
72
72
  }, function (props) {
73
- return props.state === 'error' && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), props.theme.getColor('red-500'));
73
+ return props.state === 'error' && styled.css(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), props.theme.getColor('red-500'));
74
74
  }, function (props) {
75
- return props.hasIcon && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-right: 25px;\n "])));
75
+ return props.hasIcon && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-right: 25px;\n "])));
76
76
  }, function (props) {
77
- return props.instructionsTextArea && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-top: 15px;\n padding-right: 50px;\n "])));
77
+ return props.instructionsTextArea && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-top: 15px;\n padding-right: 50px;\n "])));
78
78
  }, function (props) {
79
79
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'), 1);
80
80
  }, function (props) {
@@ -83,43 +83,47 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
83
83
  return props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-600'));
84
84
  }, function (props) {
85
85
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
86
+ }, function (props) {
87
+ return props.state === 'warning' && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n "])), props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
88
+ }, function (props) {
89
+ return props.state === 'error' && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n "])), props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
86
90
  });
87
- var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = 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\n ", ";\n\n ", "\n\n ", "\n\n ", "\n content: \"\";\n\n ", "\n"])), placeholderBaseStyle, function (props) {
91
+ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject26 || (_templateObject26 = 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\n ", ";\n\n ", "\n\n ", "\n\n ", "\n content: \"\";\n\n ", "\n"])), placeholderBaseStyle, function (props) {
88
92
  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%)"));
89
93
  }, function (props) {
90
- return !props.inputIsEmpty && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), activeLabel);
94
+ return !props.inputIsEmpty && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), activeLabel);
91
95
  }, function (props) {
92
- return props.hasPlaceholder && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n ", "\n "])), activeLabel, props.state === 'error' && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n color: ", " !important;\n "])), props.theme.getColor('red-500')));
96
+ return props.hasPlaceholder && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n ", "\n "])), activeLabel, props.state === 'error' && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n color: ", " !important;\n "])), props.theme.getColor('red-500')));
93
97
  }, function (props) {
94
- return props.hasIcon && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
98
+ return props.hasIcon && styled.css(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
95
99
  });
96
- var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject30 || (_templateObject30 = 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"])));
97
- var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = 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) {
100
+ var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = 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"])));
101
+ var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject32 || (_templateObject32 = 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) {
98
102
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-600'));
99
103
  });
100
- var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\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\n ", "\n"])), function (props) {
101
- return props.disabled && styled.css(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
104
+ var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\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\n ", "\n"])), function (props) {
105
+ return props.disabled && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
102
106
  }, TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
103
107
  return props.state === 'error' && props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500'));
104
108
  }, function (props) {
105
- return props.disabled && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
109
+ return props.disabled && styled.css(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
106
110
  });
107
- var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = 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"])), function (props) {
111
+ var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = 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"])), function (props) {
108
112
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
109
113
  }, function (props) {
110
- return (props.state === 'error-border' || props.state === 'error') && styled.css(_templateObject36 || (_templateObject36 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
114
+ return (props.state === 'error-border' || props.state === 'error') && styled.css(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
111
115
  });
112
- var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = 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) {
116
+ var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject38 || (_templateObject38 = 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) {
113
117
  return props.fadeIn ? 0 : 1;
114
118
  }, function (props) {
115
119
  return props.fadeIn ? fadeOutCheck : fadeInCheck;
116
120
  }, function (props) {
117
121
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
118
122
  });
119
- var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n margin: 0 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n cursor: pointer;\n ", ";\n\n ", "\n"])), function (props) {
123
+ var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n margin: 0 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n cursor: pointer;\n ", ";\n\n ", "\n"])), function (props) {
120
124
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('emerald-500'));
121
125
  }, function (props) {
122
- return props.state === 'error' && styled.css(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
126
+ return props.state === 'error' && styled.css(_templateObject40 || (_templateObject40 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
123
127
  });
124
128
 
125
129
  var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forwardedRef) {
@@ -134,8 +138,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
134
138
  readOnly = _ref.readOnly,
135
139
  edit = _ref.edit,
136
140
  isExpanded = _ref.isExpanded,
137
- editWarning = _ref.editWarning,
138
- maxRows = _ref.maxRows,
139
141
  showMore = _ref.showMore,
140
142
  showMoreText = _ref.showMoreText,
141
143
  autoComplete = _ref.autoComplete,
@@ -150,7 +152,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
150
152
  lightBackground = _ref.lightBackground,
151
153
  noBorder = _ref.noBorder,
152
154
  instructionsTextArea = _ref.instructionsTextArea,
153
- rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "isExpanded", "editWarning", "maxRows", "showMore", "showMoreText", "autoComplete", "description", "state", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea"]);
155
+ rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "isExpanded", "showMore", "showMoreText", "autoComplete", "description", "state", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea"]);
154
156
 
155
157
  var textInputRef = React.useRef(null);
156
158
 
@@ -169,33 +171,24 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
169
171
  maxContentRows = _useState6[0],
170
172
  setMaxContentRows = _useState6[1];
171
173
 
172
- var _useState7 = React.useState(rows),
174
+ var _useState7 = React.useState(false),
173
175
  _useState8 = defaultTheme._slicedToArray(_useState7, 2),
174
- defaultRows = _useState8[0],
175
- setDefaultRows = _useState8[1];
176
+ expanded = _useState8[0],
177
+ setExpanded = _useState8[1];
176
178
 
177
- var _useState9 = React.useState(false),
179
+ var _useState9 = React.useState(''),
178
180
  _useState10 = defaultTheme._slicedToArray(_useState9, 2),
179
- expanded = _useState10[0],
180
- setExpanded = _useState10[1];
181
+ maxHeight = _useState10[0],
182
+ setMaxHeight = _useState10[1];
181
183
 
182
- var _useState11 = React.useState(''),
184
+ var _useState11 = React.useState(false),
183
185
  _useState12 = defaultTheme._slicedToArray(_useState11, 2),
184
- maxHeight = _useState12[0],
185
- setMaxHeight = _useState12[1];
186
-
187
- var _useState13 = React.useState(false),
188
- _useState14 = defaultTheme._slicedToArray(_useState13, 2),
189
- showReadMore = _useState14[0],
190
- setShowReadMore = _useState14[1];
186
+ showReadMore = _useState12[0],
187
+ setShowReadMore = _useState12[1];
191
188
 
192
- React.useEffect(function () {
193
- setDefaultRows(rows);
194
- }, [rows]);
195
-
196
- var _useState15 = React.useState(nanoid.nanoid()),
197
- _useState16 = defaultTheme._slicedToArray(_useState15, 1),
198
- uniqueId = _useState16[0];
189
+ var _useState13 = React.useState(nanoid.nanoid()),
190
+ _useState14 = defaultTheme._slicedToArray(_useState13, 1),
191
+ uniqueId = _useState14[0];
199
192
 
200
193
  var handleTextAreaChange = function handleTextAreaChange() {
201
194
  setExpanded(!expanded);
@@ -207,35 +200,27 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
207
200
  }
208
201
 
209
202
  if (expanded === false) {
210
- setContentRows(defaultRows);
203
+ setContentRows(rows);
211
204
  }
212
205
  };
213
206
 
214
- React.useEffect(function () {
215
- var calculateRows = function calculateRows() {
216
- var lineheight = 1.5;
217
- var textareaRefCurrent = textInputRef.current;
218
-
219
- if (textareaRefCurrent) {
220
- var textarea = textareaRefCurrent.scrollHeight;
221
- var rowsLimit = Math.floor(textarea / (lineheight * 12));
222
- setMaxContentRows(rowsLimit);
223
-
224
- if (rowsLimit > defaultRows) {
225
- setExpanded(true);
226
- setShowReadMore(true);
227
- } else {
228
- setShowReadMore(false);
229
- }
207
+ var calculateRows = function calculateRows() {
208
+ var textareaRefCurrent = textInputRef.current;
209
+ var textarea = textareaRefCurrent.scrollHeight;
210
+ var calculatedRows = Math.floor(textarea / 16);
211
+ setMaxContentRows(calculatedRows);
230
212
 
231
- if (typeof maxRows === 'function') {
232
- maxRows(rowsLimit);
233
- }
234
- }
235
- };
213
+ if (calculatedRows > rows) {
214
+ setExpanded(true);
215
+ setShowReadMore(true);
216
+ } else {
217
+ setShowReadMore(false);
218
+ }
219
+ };
236
220
 
221
+ React.useEffect(function () {
237
222
  calculateRows();
238
- }, [value, defaultRows]);
223
+ }, [value]);
239
224
  if (hidden) return null;
240
225
  return React__default['default'].createElement(TextInput, {
241
226
  disabled: disabled,
@@ -256,7 +241,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
256
241
  readOnly: readOnly,
257
242
  disabled: disabled,
258
243
  edit: edit,
259
- editWarning: editWarning,
260
244
  instructionsTextArea: instructionsTextArea,
261
245
  showMore: showMore,
262
246
  state: state,
@@ -289,7 +273,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
289
273
  inputIsEmpty: inputIsEmpty
290
274
  }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
291
275
  state: state
292
- }, description), maxContentRows > defaultRows && showMore && showReadMore && React__default['default'].createElement(ShowMoreText, {
276
+ }, description), maxContentRows > rows && showMore && showReadMore && React__default['default'].createElement(ShowMoreText, {
293
277
  onClick: handleTextAreaChange
294
278
  }, showMoreText));
295
279
  });
@@ -298,7 +282,6 @@ TextArea.defaultProps = {
298
282
  noBorder: false,
299
283
  readOnly: false,
300
284
  edit: false,
301
- editWarning: false,
302
285
  hidden: false,
303
286
  showMore: false,
304
287
  showMoreText: '',
@@ -318,7 +301,6 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
318
301
  showMore: defaultTheme.PropTypes.bool,
319
302
  showMoreText: defaultTheme.PropTypes.string,
320
303
  edit: defaultTheme.PropTypes.bool,
321
- editWarning: defaultTheme.PropTypes.bool,
322
304
  autoComplete: defaultTheme.PropTypes.string,
323
305
  description: defaultTheme.PropTypes.string,
324
306
  error: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
@@ -331,7 +313,6 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
331
313
  onChange: defaultTheme.PropTypes.func,
332
314
  onBlur: defaultTheme.PropTypes.func,
333
315
  noBorder: defaultTheme.PropTypes.bool,
334
- maxRows: defaultTheme.PropTypes.func,
335
316
  isExpanded: defaultTheme.PropTypes.func,
336
317
  state: defaultTheme.PropTypes.oneOf(['', 'error', 'error-border', 'warning', 'loading', 'success']),
337
318
  instructionsTextArea: defaultTheme.PropTypes.bool
package/inputs/CompactAutocompleteSelect/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-5ee8443f.js');
3
+ var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-45b12179.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('lodash');
package/inputs/TextArea/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-baf49a63.js');
3
+ var TextArea = require('../../TextArea-14b4864b.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
package/inputs/index.js CHANGED
@@ -5,12 +5,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var ActionButton = require('../ActionButton-c3f5ed94.js');
6
6
  var Button = require('../Button-432f87c6.js');
7
7
  var Checkbox = require('../Checkbox-85394137.js');
8
- var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-5ee8443f.js');
8
+ var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-45b12179.js');
9
9
  var CompactStarRating = require('../CompactStarRating-de1bcfe9.js');
10
10
  var CompactTextInput = require('../CompactTextInput-480f59cc.js');
11
11
  var MultiSelect = require('../MultiSelect-01a257b8.js');
12
12
  var Radio = require('../Radio-c811ce4a.js');
13
- var TextArea = require('../TextArea-baf49a63.js');
13
+ var TextArea = require('../TextArea-14b4864b.js');
14
14
  var TextInput = require('../TextInput-8ea31a7b.js');
15
15
  var Switch = require('../Switch-3ac11c97.js');
16
16
  require('../defaultTheme-50f2b88f.js');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.1.0-beta.89",
3
+ "version": "1.1.0-beta.90",
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-ad31621f.js');
3
+ var AssetGallery = require('../../AssetGallery-fa59b3c7.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
@@ -19,7 +19,7 @@ require('../../shift-away-subtle-cfdf1dbe.js');
19
19
  require('../../ContextMenu-d088833b.js');
20
20
  require('../../expand-more-94585605.js');
21
21
  require('../../Checkbox-85394137.js');
22
- require('../../CompactAutocompleteSelect-5ee8443f.js');
22
+ require('../../CompactAutocompleteSelect-45b12179.js');
23
23
  require('../../check-555d831b.js');
24
24
  require('react-select');
25
25
  require('react-select-async-paginate');
@@ -35,7 +35,7 @@ require('../../Tabs-bf42275e.js');
35
35
  require('../../Tooltip-1b7b0052.js');
36
36
  require('../../MultiSelect-01a257b8.js');
37
37
  require('../../Radio-c811ce4a.js');
38
- require('../../TextArea-baf49a63.js');
38
+ require('../../TextArea-14b4864b.js');
39
39
  require('../../Switch-3ac11c97.js');
40
40
  require('../../warning-circle-24522402.js');
41
41
 
package/widgets/Instructions/index.js CHANGED
@@ -1,12 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-c16a0832.js');
3
+ var Instructions = require('../../Instructions-4041b686.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('react');
8
8
  require('../../warning-circle-24522402.js');
9
- require('../../CompactAutocompleteSelect-5ee8443f.js');
9
+ require('../../CompactAutocompleteSelect-45b12179.js');
10
10
  require('nanoid');
11
11
  require('../../check-555d831b.js');
12
12
  require('react-select');
@@ -15,7 +15,7 @@ require('../../react-select-creatable.esm-7231b55e.js');
15
15
  require('react-dom');
16
16
  require('../../close-ebf2f3cf.js');
17
17
  require('../../expand-more-94585605.js');
18
- require('../../TextArea-baf49a63.js');
18
+ require('../../TextArea-14b4864b.js');
19
19
  require('../../edit-note-c47d292e.js');
20
20
 
21
21
 
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-ad31621f.js');
5
+ var AssetGallery = require('../AssetGallery-fa59b3c7.js');
6
6
  var ContextMenu = require('../ContextMenu-d088833b.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-449e6019.js');
8
- var Instructions = require('../Instructions-c16a0832.js');
8
+ var Instructions = require('../Instructions-4041b686.js');
9
9
  require('../defaultTheme-50f2b88f.js');
10
10
  require('styled-components');
11
11
  require('react');
@@ -23,7 +23,7 @@ require('@tippyjs/react');
23
23
  require('../shift-away-subtle-cfdf1dbe.js');
24
24
  require('../expand-more-94585605.js');
25
25
  require('../Checkbox-85394137.js');
26
- require('../CompactAutocompleteSelect-5ee8443f.js');
26
+ require('../CompactAutocompleteSelect-45b12179.js');
27
27
  require('../check-555d831b.js');
28
28
  require('react-select');
29
29
  require('react-select-async-paginate');
@@ -39,7 +39,7 @@ require('../Tabs-bf42275e.js');
39
39
  require('../Tooltip-1b7b0052.js');
40
40
  require('../MultiSelect-01a257b8.js');
41
41
  require('../Radio-c811ce4a.js');
42
- require('../TextArea-baf49a63.js');
42
+ require('../TextArea-14b4864b.js');
43
43
  require('../Switch-3ac11c97.js');
44
44
  require('../warning-circle-24522402.js');
45
45