@ntbjs/react-components 1.2.0-rc.82 → 1.2.0-rc.83

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 (65) hide show
  1. package/{ActionButton-46735b89.js → ActionButton-a9316775.js} +10 -11
  2. package/{Alert-13b75102.js → Alert-d69a3f95.js} +20 -24
  3. package/{AssetGallery-14556429.js → AssetGallery-26d11836.js} +338 -493
  4. package/{AssetPreviewTopBar-912c3469.js → AssetPreviewTopBar-c9e45035.js} +27 -31
  5. package/{Badge-aec841c8.js → Badge-cbbff6b8.js} +28 -49
  6. package/{Button-49f82b31.js → Button-39607724.js} +53 -65
  7. package/{Checkbox-68dc38a8.js → Checkbox-ad9c9e54.js} +30 -35
  8. package/{CompactAutocompleteSelect-ccde6a60.js → CompactAutocompleteSelect-b8718825.js} +82 -114
  9. package/{CompactStarRating-b1b15bd1.js → CompactStarRating-bbe8800b.js} +71 -87
  10. package/{CompactTextInput-9b36b1b1.js → CompactTextInput-72224756.js} +67 -79
  11. package/{ContextMenu-4ec3d9f3.js → ContextMenu-4eb8fdc5.js} +6 -6
  12. package/{ContextMenuItem-ba2b697e.js → ContextMenuItem-c536b460.js} +22 -26
  13. package/{InputGroup-49fbc423.js → InputGroup-a89a0ea3.js} +6 -6
  14. package/{Instructions-86834a28.js → Instructions-cfb1dcd7.js} +66 -81
  15. package/{MultiLevelCheckboxSelect-448cd692.js → MultiLevelCheckboxSelect-654c291b.js} +102 -164
  16. package/{MultiSelect-efd60232.js → MultiSelect-149a817b.js} +71 -101
  17. package/{Popover-569cd272.js → Popover-c5e425a7.js} +19 -21
  18. package/{Radio-32d0513a.js → Radio-55db4781.js} +21 -22
  19. package/{SectionSeparator-259a22ed.js → SectionSeparator-af8dc1ce.js} +6 -6
  20. package/{Switch-4a41585f.js → Switch-04ecd8d0.js} +25 -27
  21. package/{Tab-f499ecbc.js → Tab-e43241f0.js} +7 -7
  22. package/{Tabs-3c6c784d.js → Tabs-21e0079f.js} +23 -37
  23. package/{TextArea-767dc470.js → TextArea-c2620d92.js} +73 -97
  24. package/{TextInput-0d109708.js → TextInput-9a995449.js} +41 -48
  25. package/{Tooltip-66daf6e3.js → Tooltip-a68a7e49.js} +13 -13
  26. package/{VerificationStatusIcon-6fe95a92.js → VerificationStatusIcon-3bae6e2f.js} +20 -30
  27. package/{close-ebf2f3cf.js → close-1751121a.js} +8 -12
  28. package/data/Alert/index.js +2 -2
  29. package/data/Badge/index.js +2 -2
  30. package/data/Popover/index.js +3 -3
  31. package/data/Tab/index.js +2 -2
  32. package/data/Tabs/index.js +3 -3
  33. package/data/Tooltip/index.js +3 -3
  34. package/data/index.js +9 -9
  35. package/{defaultTheme-ea44e34a.js → defaultTheme-cd01e6c2.js} +212 -260
  36. package/edit-note-cefe2215.js +37 -0
  37. package/{expand-more-94585605.js → expand-more-d74e2bd2.js} +8 -12
  38. package/inputs/ActionButton/index.js +2 -2
  39. package/inputs/Button/index.js +6 -6
  40. package/inputs/Checkbox/index.js +2 -2
  41. package/inputs/CompactAutocompleteSelect/index.js +13 -13
  42. package/inputs/CompactStarRating/index.js +10 -10
  43. package/inputs/CompactTextInput/index.js +11 -11
  44. package/inputs/MultiSelect/index.js +4 -4
  45. package/inputs/Radio/index.js +2 -2
  46. package/inputs/Switch/index.js +2 -2
  47. package/inputs/TextArea/index.js +11 -11
  48. package/inputs/TextInput/index.js +3 -3
  49. package/inputs/index.js +28 -28
  50. package/layout/InputGroup/index.js +2 -2
  51. package/layout/SectionSeparator/index.js +2 -2
  52. package/layout/index.js +3 -3
  53. package/package.json +3 -3
  54. package/{react-select-creatable.esm-2f23d6c6.js → react-select-creatable.esm-66ca61dc.js} +1470 -1272
  55. package/{shift-away-subtle-0bed9a3c.js → shift-away-subtle-631cd794.js} +1 -1
  56. package/ssr/index.js +1 -3
  57. package/{warning-circle-24522402.js → warning-circle-478e65cc.js} +8 -12
  58. package/widgets/AssetGallery/index.js +31 -31
  59. package/widgets/AssetPreview/AssetPreviewTopBar/index.js +3 -3
  60. package/widgets/ContextMenu/ContextMenuItem/index.js +2 -2
  61. package/widgets/ContextMenu/ContextMenuItemsGroup/index.js +6 -6
  62. package/widgets/ContextMenu/index.js +2 -2
  63. package/widgets/Instructions/index.js +17 -17
  64. package/widgets/index.js +33 -33
  65. package/edit-note-c47d292e.js +0 -41
@@ -1,17 +1,17 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-ea44e34a.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var React = require('react');
5
5
  var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
6
6
  var nanoid = require('nanoid');
7
- require('./Alert-13b75102.js');
8
- require('./Badge-aec841c8.js');
9
- require('./Popover-569cd272.js');
10
- require('./Tab-f499ecbc.js');
11
- require('./Tabs-3c6c784d.js');
12
- var Tooltip = require('./Tooltip-66daf6e3.js');
13
- require('./VerificationStatusIcon-6fe95a92.js');
14
- var editNote = require('./edit-note-c47d292e.js');
7
+ require('./Alert-d69a3f95.js');
8
+ require('./Badge-cbbff6b8.js');
9
+ require('./Popover-c5e425a7.js');
10
+ require('./Tab-e43241f0.js');
11
+ require('./Tabs-21e0079f.js');
12
+ var Tooltip = require('./Tooltip-a68a7e49.js');
13
+ require('./VerificationStatusIcon-3bae6e2f.js');
14
+ var editNote = require('./edit-note-cefe2215.js');
15
15
  var styled = require('styled-components');
16
16
 
17
17
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -28,12 +28,12 @@ var placeholderBaseStyle = styled.css(_templateObject4 || (_templateObject4 = de
28
28
  }, function (props) {
29
29
  return props.theme.themeProp('opacity', 0.6, 0.5);
30
30
  });
31
- var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n display: flex;\n align-items: flex-start;\n position: absolute;\n right: 15px;\n top: 10px;\n bottom: 0;\n > .smallPadingIcon {\n padding: 4px;\n width: 15px;\n height: 15px;\n border-radius: 5px;\n opacity: 1;\n margin-top: -5px;\n ", "\n }\n svg {\n width: 15px;\n opacity: 0.7;\n transition: opacity 250ms;\n\n ", "\n }\n"])), function (props) {
31
+ var InputIconContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n display: flex;\n align-items: flex-start;\n position: absolute;\n right: 15px;\n top: 10px;\n bottom: 0;\n > .smallPadingIcon {\n padding: 4px;\n width: 15px;\n height: 15px;\n border-radius: 5px;\n opacity: 1;\n margin-top: -5px;\n ", "\n }\n svg {\n width: 15px;\n opacity: 0.7;\n transition: opacity 250ms;\n\n ", "\n }\n"])), function (props) {
32
32
  return props.theme.themeProp('background-color', props.theme.getColor('gray-900'), props.theme.getColor('gray-300'), '!important');
33
33
  }, function (props) {
34
34
  return props.disabled && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
35
35
  });
36
- 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 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 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\n \n }\n"])), function (props) {
36
+ 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 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 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\n \n }\n"])), function (props) {
37
37
  return props.borderRadius && styled.css(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n border-radius: ", "px;\n "])), props.borderRadius);
38
38
  }, function (props) {
39
39
  return props.showMore && !props.expanded && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n -webkit-mask-image: linear-gradient(0deg, transparent 5px, white 45px);\n "])));
@@ -128,7 +128,7 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
128
128
  }, function (props) {
129
129
  return props.edit && props.type === 'warning' && props.theme.themeProp('background', '#2F2402', '#FFF3A7');
130
130
  });
131
- var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject30 || (_templateObject30 = 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\n ", "\n content: \"\";\n\n ", "\n"])), function (props) {
131
+ var TextInputLabel = styled__default["default"].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject30 || (_templateObject30 = 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\n ", "\n content: \"\";\n\n ", "\n"])), function (props) {
132
132
  return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
133
133
  }, placeholderBaseStyle, function (props) {
134
134
  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%)"));
@@ -139,32 +139,32 @@ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDe
139
139
  }, function (props) {
140
140
  return props.hasIcon && styled.css(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
141
141
  });
142
- var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject34 || (_templateObject34 = 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"])));
143
- var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n display: flex;\n padding: 0 10px 0 30px;\n opacity: 0.6;\n transition: opacity 250ms;\n ", "\n svg {\n margin-top: 11px;\n width: 15px;\n }\n"])), function (props) {
142
+ var TextInputFieldIcon = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject34 || (_templateObject34 = 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"])));
143
+ var TextInputFieldIconAlert = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n display: flex;\n padding: 0 10px 0 30px;\n opacity: 0.6;\n transition: opacity 250ms;\n ", "\n svg {\n margin-top: 11px;\n width: 15px;\n }\n"])), function (props) {
144
144
  return props.type === 'warning' && props.theme.themeProp('color', '#EAB308', '#2F2402');
145
145
  });
146
- var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = 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) {
146
+ var TextInput = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = 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) {
147
147
  return props.readOnly && styled.css(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n pointer-events: none;\n "])));
148
148
  }, function (props) {
149
149
  return props.disabled && styled.css(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
150
150
  }, TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
151
151
  return props.type === 'error' && props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500'));
152
152
  });
153
- var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject39 || (_templateObject39 = 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) {
153
+ var Description = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject39 || (_templateObject39 = 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) {
154
154
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
155
155
  }, function (props) {
156
156
  return (props.type === 'warning-border' || props.type === 'warning') && styled.css(_templateObject40 || (_templateObject40 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
157
157
  }, function (props) {
158
158
  return (props.type === 'error-border' || props.type === 'error') && styled.css(_templateObject41 || (_templateObject41 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
159
159
  });
160
- var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject42 || (_templateObject42 = 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) {
160
+ var SuccessContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject42 || (_templateObject42 = 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) {
161
161
  return props.fadeIn ? 0 : 1;
162
162
  }, function (props) {
163
163
  return props.fadeIn ? fadeOutCheck : fadeInCheck;
164
164
  }, function (props) {
165
165
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
166
166
  });
167
- var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject43 || (_templateObject43 = 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) {
167
+ var ShowMoreText = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject43 || (_templateObject43 = 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) {
168
168
  return props.expanded && styled.css(_templateObject44 || (_templateObject44 = defaultTheme._taggedTemplateLiteral(["\n margin-top: 0px;\n "])));
169
169
  }, function (props) {
170
170
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
@@ -174,142 +174,122 @@ var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaul
174
174
  return props.type === 'error' && styled.css(_templateObject45 || (_templateObject45 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
175
175
  });
176
176
 
177
- var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forwardedRef) {
177
+ var _excluded = ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "showMore", "showMoreText", "showLessText", "autoComplete", "description", "type", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius"];
178
+ var TextArea = React__default["default"].forwardRef(function TextArea(_ref, forwardedRef) {
178
179
  var value = _ref.value,
179
- defaultValue = _ref.defaultValue,
180
- name = _ref.name,
181
- label = _ref.label,
182
- placeholder = _ref.placeholder,
183
- required = _ref.required,
184
- disabled = _ref.disabled,
185
- hidden = _ref.hidden,
186
- readOnly = _ref.readOnly,
187
- edit = _ref.edit,
188
- showMore = _ref.showMore,
189
- showMoreText = _ref.showMoreText,
190
- showLessText = _ref.showLessText,
191
- autoComplete = _ref.autoComplete,
192
- description = _ref.description,
193
- type = _ref.type,
194
- icon = _ref.icon,
195
- rows = _ref.rows,
196
- className = _ref.className,
197
- style = _ref.style,
198
- _onChange = _ref.onChange,
199
- onBlur = _ref.onBlur,
200
- lightBackground = _ref.lightBackground,
201
- noBorder = _ref.noBorder,
202
- instructionsTextArea = _ref.instructionsTextArea,
203
- loadingIcon = _ref.loadingIcon,
204
- successIcon = _ref.successIcon,
205
- padding = _ref.padding,
206
- descriptionToolTip = _ref.descriptionToolTip,
207
- borderRadius = _ref.borderRadius,
208
- rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "showMore", "showMoreText", "showLessText", "autoComplete", "description", "type", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius"]);
209
-
180
+ defaultValue = _ref.defaultValue,
181
+ name = _ref.name,
182
+ label = _ref.label,
183
+ placeholder = _ref.placeholder,
184
+ required = _ref.required,
185
+ disabled = _ref.disabled,
186
+ hidden = _ref.hidden,
187
+ readOnly = _ref.readOnly,
188
+ edit = _ref.edit,
189
+ showMore = _ref.showMore,
190
+ showMoreText = _ref.showMoreText,
191
+ showLessText = _ref.showLessText,
192
+ autoComplete = _ref.autoComplete,
193
+ description = _ref.description,
194
+ type = _ref.type,
195
+ icon = _ref.icon,
196
+ rows = _ref.rows,
197
+ className = _ref.className,
198
+ style = _ref.style,
199
+ _onChange = _ref.onChange,
200
+ onBlur = _ref.onBlur,
201
+ lightBackground = _ref.lightBackground,
202
+ noBorder = _ref.noBorder,
203
+ instructionsTextArea = _ref.instructionsTextArea,
204
+ loadingIcon = _ref.loadingIcon,
205
+ successIcon = _ref.successIcon,
206
+ padding = _ref.padding,
207
+ descriptionToolTip = _ref.descriptionToolTip,
208
+ borderRadius = _ref.borderRadius,
209
+ rest = defaultTheme._objectWithoutProperties(_ref, _excluded);
210
210
  var textInputDomNode = React.useRef(null);
211
211
  var textInputRef = useMergedRefs.useMergedRefs(forwardedRef, textInputDomNode);
212
-
213
212
  var _useState = React.useState(!(value || defaultValue)),
214
- _useState2 = defaultTheme._slicedToArray(_useState, 2),
215
- inputIsEmpty = _useState2[0],
216
- setInputIsEmpty = _useState2[1];
217
-
213
+ _useState2 = defaultTheme._slicedToArray(_useState, 2),
214
+ inputIsEmpty = _useState2[0],
215
+ setInputIsEmpty = _useState2[1];
218
216
  var _useState3 = React.useState(value || defaultValue),
219
- _useState4 = defaultTheme._slicedToArray(_useState3, 2),
220
- defaultInput = _useState4[0],
221
- setDefaultInput = _useState4[1];
222
-
217
+ _useState4 = defaultTheme._slicedToArray(_useState3, 2),
218
+ defaultInput = _useState4[0],
219
+ setDefaultInput = _useState4[1];
223
220
  var _useState5 = React.useState(false),
224
- _useState6 = defaultTheme._slicedToArray(_useState5, 2),
225
- expanded = _useState6[0],
226
- setExpanded = _useState6[1];
227
-
221
+ _useState6 = defaultTheme._slicedToArray(_useState5, 2),
222
+ expanded = _useState6[0],
223
+ setExpanded = _useState6[1];
228
224
  var _useState7 = React.useState(false),
229
- _useState8 = defaultTheme._slicedToArray(_useState7, 2),
230
- autoFocus = _useState8[0],
231
- setAutoFocus = _useState8[1];
232
-
225
+ _useState8 = defaultTheme._slicedToArray(_useState7, 2),
226
+ autoFocus = _useState8[0],
227
+ setAutoFocus = _useState8[1];
233
228
  var _useState9 = React.useState(nanoid.nanoid()),
234
- _useState10 = defaultTheme._slicedToArray(_useState9, 1),
235
- uniqueId = _useState10[0];
236
-
229
+ _useState10 = defaultTheme._slicedToArray(_useState9, 1),
230
+ uniqueId = _useState10[0];
237
231
  var defaultHeight = rows * 16;
238
232
  var memoizedDescriptionToolTip = React.useMemo(function () {
239
233
  return descriptionToolTip;
240
234
  }, [descriptionToolTip]);
241
-
242
235
  var defaultHeightFunction = function defaultHeightFunction() {
243
236
  var textareaRefCurrent = textInputDomNode.current;
244
237
  textareaRefCurrent.style.height = "".concat(defaultHeight, "px");
245
238
  };
246
-
247
239
  var adjustHeighToScroll = function adjustHeighToScroll() {
248
240
  var textareaRefCurrent = textInputDomNode === null || textInputDomNode === void 0 ? void 0 : textInputDomNode.current;
249
-
250
241
  if (textareaRefCurrent !== null) {
251
242
  textareaRefCurrent.style.height = 'auto';
252
243
  var newHeight = textareaRefCurrent.scrollHeight;
253
244
  textareaRefCurrent.style.height = "".concat(newHeight, "px");
254
245
  }
255
246
  };
256
-
257
247
  React.useEffect(function () {
258
248
  defaultHeightFunction();
259
249
  setDefaultInput(value || defaultValue);
260
250
  setExpanded(false);
261
251
  adjustHeighToScroll();
262
-
263
252
  if ((value || defaultValue) != defaultInput) {
264
253
  adjustHeighToScroll();
265
254
  }
266
255
  }, []);
267
256
  React.useEffect(function () {
268
257
  defaultHeightFunction();
269
-
270
258
  if ((value || defaultValue) != defaultInput) {
271
259
  adjustHeighToScroll();
272
260
  }
273
261
  }, [value, defaultValue]);
274
-
275
262
  var handleTextAreaClick = function handleTextAreaClick() {
276
263
  var textareaRefCurrent = textInputDomNode.current;
277
-
278
264
  if (textareaRefCurrent !== null) {
279
265
  textareaRefCurrent.style.height = "".concat(textareaRefCurrent.scrollHeight, "px");
280
266
  }
281
-
282
267
  if (!expanded) {
283
268
  setExpanded(true);
284
269
  }
285
270
  };
286
-
287
271
  var handleTextAreaShowLess = function handleTextAreaShowLess() {
288
272
  var textareaRefCurrent = textInputDomNode.current;
289
-
290
273
  if (textareaRefCurrent !== null) {
291
274
  textareaRefCurrent.style.height = expanded ? "".concat(rows * 16, "px") : "".concat(textareaRefCurrent.scrollHeight, "px");
292
275
  }
293
-
294
276
  setExpanded(!expanded);
295
277
  };
296
-
297
278
  var onKeyDown = React.useCallback(function (event) {
298
279
  if (event.key === 'Enter') {
299
280
  event.stopPropagation();
300
281
  }
301
282
  }, []);
302
-
303
283
  var input = function input() {
304
- return React__default['default'].createElement(TextInput, {
284
+ return React__default["default"].createElement(TextInput, {
305
285
  disabled: disabled,
306
286
  readOnly: readOnly,
307
287
  type: type,
308
288
  className: className,
309
289
  style: style
310
- }, React__default['default'].createElement(TextInputFieldIconAlert, {
290
+ }, React__default["default"].createElement(TextInputFieldIconAlert, {
311
291
  type: type
312
- }, icon), React__default['default'].createElement(TextInputField, defaultTheme._extends({
292
+ }, icon), React__default["default"].createElement(TextInputField, defaultTheme._extends({
313
293
  autoFocus: autoFocus,
314
294
  borderRadius: borderRadius,
315
295
  ref: textInputRef,
@@ -337,18 +317,15 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
337
317
  onChange: function onChange(e) {
338
318
  if (e.target.value) {
339
319
  setInputIsEmpty(false);
340
-
341
320
  if (!autoFocus) {
342
321
  setAutoFocus(true);
343
322
  }
344
323
  } else {
345
324
  setInputIsEmpty(true);
346
-
347
325
  if (!autoFocus) {
348
326
  setAutoFocus(true);
349
327
  }
350
328
  }
351
-
352
329
  _onChange(e);
353
330
  },
354
331
  onKeyDown: onKeyDown,
@@ -356,25 +333,24 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
356
333
  noBorder: noBorder
357
334
  }, rest, {
358
335
  onClick: handleTextAreaClick
359
- })), (type === 'loading' || type === 'success') && React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
336
+ })), (type === 'loading' || type === 'success') && React__default["default"].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React__default["default"].createElement(InputIconContainer, {
360
337
  disabled: disabled
361
- }, React__default['default'].createElement(editNote.SvgEditNote, {
338
+ }, React__default["default"].createElement(editNote.SvgEditNote, {
362
339
  className: padding === 'small' ? 'smallPadingIcon' : undefined
363
- })), label && React__default['default'].createElement(TextInputLabel, {
340
+ })), label && React__default["default"].createElement(TextInputLabel, {
364
341
  htmlFor: "text-input-".concat(uniqueId),
365
342
  hasPlaceholder: Boolean(placeholder),
366
343
  hasIcon: Boolean(icon),
367
344
  inputIsEmpty: inputIsEmpty
368
- }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
345
+ }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default["default"].createElement(Description, {
369
346
  type: type
370
- }, description), showMore && React__default['default'].createElement(ShowMoreText, {
347
+ }, description), showMore && React__default["default"].createElement(ShowMoreText, {
371
348
  onClick: showMore ? handleTextAreaShowLess : undefined,
372
349
  expanded: expanded
373
350
  }, !expanded ? showMoreText : expanded ? showLessText : null));
374
351
  };
375
-
376
352
  if (hidden) return null;
377
- return React__default['default'].createElement(React__default['default'].Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React__default['default'].createElement("div", null, React__default['default'].createElement(Tooltip.Tooltip, {
353
+ return React__default["default"].createElement(React__default["default"].Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React__default["default"].createElement("div", null, React__default["default"].createElement(Tooltip.Tooltip, {
378
354
  content: memoizedDescriptionToolTip,
379
355
  key: "tooltipTextArea1",
380
356
  placement: "bottom-end",
@@ -1,11 +1,11 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-ea44e34a.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var React = require('react');
5
5
  var nanoid = require('nanoid');
6
6
  var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
7
7
  var lodash = require('lodash');
8
- var editNote = require('./edit-note-c47d292e.js');
8
+ var editNote = require('./edit-note-cefe2215.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 }; }
@@ -15,7 +15,7 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
15
15
 
16
16
  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;
17
17
  var activeLabel = styled.css(_templateObject || (_templateObject = 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"])));
18
- var Adornment = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n flex-shrink: 0;\n font-family: inherit;\n font-size: 0.875rem;\n line-height: initial;\n padding: 13px 10px;\n\n ", "\n ", "\n border: 1px solid;\n ", "\n border-radius: 3px;\n ", "\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n height: 2.75rem;\n\n ", "\n ", "\n"])), function (props) {
18
+ var Adornment = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n flex-shrink: 0;\n font-family: inherit;\n font-size: 0.875rem;\n line-height: initial;\n padding: 13px 10px;\n\n ", "\n ", "\n border: 1px solid;\n ", "\n border-radius: 3px;\n ", "\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n height: 2.75rem;\n\n ", "\n ", "\n"])), function (props) {
19
19
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
20
20
  }, function (props) {
21
21
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
@@ -28,17 +28,17 @@ var Adornment = styled__default['default'].div.attrs(defaultTheme.applyDefaultTh
28
28
  }, function (props) {
29
29
  return props.error && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", " !important;\n "])), props.theme.getColor('red-500'));
30
30
  });
31
- var TextInputWrapper = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-content: center;\n\n &:focus-within {\n ", " {\n outline: none;\n ", "\n }\n }\n"])), Adornment, function (props) {
31
+ var TextInputWrapper = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-content: center;\n\n &:focus-within {\n ", " {\n outline: none;\n ", "\n }\n }\n"])), Adornment, function (props) {
32
32
  return props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-600'), 1);
33
33
  });
34
- var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n padding-right: 4px;\n padding-left: 30px;\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n color: ", ";\n\n ", "\n\n ", "\n\n > svg {\n width: 12px;\n }\n"])), function (props) {
34
+ var InputIconContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n padding-right: 4px;\n padding-left: 30px;\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n color: ", ";\n\n ", "\n\n ", "\n\n > svg {\n width: 12px;\n }\n"])), function (props) {
35
35
  return props.theme.getColor('gray-400');
36
36
  }, function (props) {
37
37
  return props.warning && props.theme.themeProp('color', '#C3AF43', '#C3AF43');
38
38
  }, function (props) {
39
39
  return props.error && props.theme.themeProp('color', '#CB968F', '#CB968F');
40
40
  });
41
- var TextInputField = styled__default['default'].input.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n line-height: 1;\n padding: 13px 10px;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n height: 2.75rem !important; // important is needed to override the default Foundation styling used in the Mediebank;\n margin-bottom: 0; // needed to override the default Foundation styling used in the Mediebank;\n ", "\n ", "\n border: 1px solid;\n ", ";\n\n ", "\n\n ", "\n ", "\n ", "\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n\n &&:hover:not(:focus) {\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n transition: opacity 350ms;\n }\n }\n\n :focus {\n outline: none;\n border-color: ", " !important\n ", "\n"])), function (props) {
41
+ var TextInputField = styled__default["default"].input.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n line-height: 1;\n padding: 13px 10px;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n height: 2.75rem !important; // important is needed to override the default Foundation styling used in the Mediebank;\n margin-bottom: 0; // needed to override the default Foundation styling used in the Mediebank;\n ", "\n ", "\n border: 1px solid;\n ", ";\n\n ", "\n\n ", "\n ", "\n ", "\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n\n &&:hover:not(:focus) {\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n transition: opacity 350ms;\n }\n }\n\n :focus {\n outline: none;\n border-color: ", " !important\n ", "\n"])), function (props) {
42
42
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
43
43
  }, function (props) {
44
44
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
@@ -63,7 +63,7 @@ var TextInputField = styled__default['default'].input.attrs(defaultTheme.applyDe
63
63
  }, function (props) {
64
64
  return props.readOnly && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n outline: none;\n "])));
65
65
  });
66
- var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 15px;\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\n\n ", "\n"])), function (props) {
66
+ var TextInputLabel = styled__default["default"].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 15px;\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\n\n ", "\n"])), function (props) {
67
67
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'));
68
68
  }, function (props) {
69
69
  return props.theme.themeProp('opacity', 0.6, 0.5);
@@ -74,8 +74,8 @@ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDe
74
74
  }, function (props) {
75
75
  return props.hasIcon && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n left: 35px;\n "])));
76
76
  });
77
- var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = 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"])));
78
- var TextInput$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject19 || (_templateObject19 = 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 \n}\n"])), function (props) {
77
+ var TextInputFieldIcon = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = 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"])));
78
+ var TextInput$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject19 || (_templateObject19 = 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 \n}\n"])), function (props) {
79
79
  return props.disabled && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n user-select: none;\n opacity: 0.5;\n cursor: not-allowed;\n > * {\n pointer-events: none;\n }\n "])));
80
80
  }, TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
81
81
  return props.error && props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500'));
@@ -84,7 +84,7 @@ var TextInput$1 = styled__default['default'].div.attrs(defaultTheme.applyDefault
84
84
  }, function (props) {
85
85
  return props.warning && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n color: ", ";\n "])), props.theme.getColor('orange-500'));
86
86
  });
87
- var Description = styled__default['default'].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = 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) {
87
+ var Description = styled__default["default"].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = 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) {
88
88
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
89
89
  }, function (props) {
90
90
  return props.error && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
@@ -92,72 +92,65 @@ var Description = styled__default['default'].p.attrs(defaultTheme.applyDefaultTh
92
92
  return props.warning && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
93
93
  });
94
94
 
95
- var TextInput = React__default['default'].forwardRef(function TextInput(_ref, forwardedRef) {
95
+ var _excluded = ["value", "defaultValue", "name", "label", "placeholder", "type", "required", "disabled", "readOnly", "autoComplete", "description", "error", "warning", "icon", "adornments", "className", "style", "onChange", "onBlur", "noBorder"];
96
+ var TextInput = React__default["default"].forwardRef(function TextInput(_ref, forwardedRef) {
96
97
  var value = _ref.value,
97
- defaultValue = _ref.defaultValue,
98
- name = _ref.name,
99
- label = _ref.label,
100
- placeholder = _ref.placeholder,
101
- type = _ref.type,
102
- required = _ref.required,
103
- disabled = _ref.disabled,
104
- readOnly = _ref.readOnly,
105
- autoComplete = _ref.autoComplete,
106
- description = _ref.description,
107
- error = _ref.error,
108
- warning = _ref.warning,
109
- icon = _ref.icon,
110
- adornments = _ref.adornments,
111
- className = _ref.className,
112
- style = _ref.style,
113
- onChange = _ref.onChange,
114
- onBlur = _ref.onBlur,
115
- noBorder = _ref.noBorder,
116
- rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "type", "required", "disabled", "readOnly", "autoComplete", "description", "error", "warning", "icon", "adornments", "className", "style", "onChange", "onBlur", "noBorder"]);
117
-
98
+ defaultValue = _ref.defaultValue,
99
+ name = _ref.name,
100
+ label = _ref.label,
101
+ placeholder = _ref.placeholder,
102
+ type = _ref.type,
103
+ required = _ref.required,
104
+ disabled = _ref.disabled,
105
+ readOnly = _ref.readOnly,
106
+ autoComplete = _ref.autoComplete,
107
+ description = _ref.description,
108
+ error = _ref.error,
109
+ warning = _ref.warning,
110
+ icon = _ref.icon,
111
+ adornments = _ref.adornments,
112
+ className = _ref.className,
113
+ style = _ref.style,
114
+ onChange = _ref.onChange,
115
+ onBlur = _ref.onBlur,
116
+ noBorder = _ref.noBorder,
117
+ rest = defaultTheme._objectWithoutProperties(_ref, _excluded);
118
118
  var textInputDomNode = React.useRef(null);
119
119
  var textInputRef = useMergedRefs.useMergedRefs(forwardedRef, textInputDomNode);
120
-
121
120
  var _useState = React.useState(nanoid.nanoid()),
122
- _useState2 = defaultTheme._slicedToArray(_useState, 1),
123
- uniqueId = _useState2[0];
124
-
121
+ _useState2 = defaultTheme._slicedToArray(_useState, 1),
122
+ uniqueId = _useState2[0];
125
123
  var hasError = React.useMemo(function () {
126
124
  if (lodash.isBoolean(error)) {
127
125
  return error;
128
126
  }
129
-
130
127
  return !lodash.isEmpty(error);
131
128
  }, [error]);
132
129
  var hasWarning = React.useMemo(function () {
133
130
  if (lodash.isBoolean(warning)) {
134
131
  return warning;
135
132
  }
136
-
137
133
  return !lodash.isEmpty(warning);
138
134
  }, [warning]);
139
135
  var descriptionText = React.useMemo(function () {
140
136
  if (!lodash.isEmpty(error)) {
141
137
  return error;
142
138
  }
143
-
144
139
  if (!lodash.isEmpty(warning)) {
145
140
  return warning;
146
141
  }
147
-
148
142
  if (!lodash.isEmpty(description)) {
149
143
  return description;
150
144
  }
151
-
152
145
  return null;
153
146
  }, [description, error, warning]);
154
- return React__default['default'].createElement(TextInput$1, {
147
+ return React__default["default"].createElement(TextInput$1, {
155
148
  error: hasError,
156
149
  disabled: disabled,
157
150
  warning: hasWarning,
158
151
  className: className,
159
152
  style: style
160
- }, typeof icon !== 'undefined' && React__default['default'].createElement(TextInputFieldIcon, null, icon), React__default['default'].createElement(TextInputWrapper, null, typeof (adornments === null || adornments === void 0 ? void 0 : adornments.prefix) === 'string' && adornments.prefix.length > 0 && React__default['default'].createElement(Adornment, {
153
+ }, typeof icon !== 'undefined' && React__default["default"].createElement(TextInputFieldIcon, null, icon), React__default["default"].createElement(TextInputWrapper, null, typeof (adornments === null || adornments === void 0 ? void 0 : adornments.prefix) === 'string' && adornments.prefix.length > 0 && React__default["default"].createElement(Adornment, {
161
154
  htmlFor: "text-input-".concat(uniqueId),
162
155
  error: hasError,
163
156
  warning: hasWarning,
@@ -165,7 +158,7 @@ var TextInput = React__default['default'].forwardRef(function TextInput(_ref, fo
165
158
  onClick: function onClick() {
166
159
  return textInputDomNode.current.focus();
167
160
  }
168
- }, adornments.prefix), React__default['default'].createElement(TextInputField, defaultTheme._extends({
161
+ }, adornments.prefix), React__default["default"].createElement(TextInputField, defaultTheme._extends({
169
162
  ref: textInputRef,
170
163
  value: value,
171
164
  defaultValue: defaultValue,
@@ -182,23 +175,23 @@ var TextInput = React__default['default'].forwardRef(function TextInput(_ref, fo
182
175
  onBlur: onBlur,
183
176
  readOnly: readOnly,
184
177
  noBorder: noBorder
185
- }, rest)), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
178
+ }, rest)), !readOnly && noBorder && React__default["default"].createElement(InputIconContainer, {
186
179
  error: error,
187
180
  warning: warning
188
- }, React__default['default'].createElement(editNote.SvgEditNote, null)), label && React__default['default'].createElement(TextInputLabel, {
181
+ }, React__default["default"].createElement(editNote.SvgEditNote, null)), label && React__default["default"].createElement(TextInputLabel, {
189
182
  htmlFor: "text-input-".concat(uniqueId),
190
183
  hasPlaceholder: Boolean(placeholder),
191
184
  hasAdornments: Boolean(typeof (adornments === null || adornments === void 0 ? void 0 : adornments.prefix) === 'string' && adornments.prefix.length > 0 || typeof (adornments === null || adornments === void 0 ? void 0 : adornments.suffix) === 'string' && adornments.suffix.length > 0),
192
185
  hasIcon: Boolean(icon),
193
186
  error: hasError
194
- }, label, required && ' *'), typeof (adornments === null || adornments === void 0 ? void 0 : adornments.suffix) === 'string' && adornments.suffix.length > 0 && React__default['default'].createElement(Adornment, {
187
+ }, label, required && ' *'), typeof (adornments === null || adornments === void 0 ? void 0 : adornments.suffix) === 'string' && adornments.suffix.length > 0 && React__default["default"].createElement(Adornment, {
195
188
  error: hasError,
196
189
  warning: hasWarning,
197
190
  isPrefix: false,
198
191
  onClick: function onClick() {
199
192
  return textInputDomNode.current.focus();
200
193
  }
201
- }, adornments.suffix)), typeof descriptionText === 'string' && descriptionText.length > 0 && React__default['default'].createElement(Description, {
194
+ }, adornments.suffix)), typeof descriptionText === 'string' && descriptionText.length > 0 && React__default["default"].createElement(Description, {
202
195
  error: hasError,
203
196
  warning: hasWarning
204
197
  }, descriptionText));
@@ -1,10 +1,10 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-ea44e34a.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
6
  var TippyTooltip = require('@tippyjs/react');
7
- require('./shift-away-subtle-0bed9a3c.js');
7
+ require('./shift-away-subtle-631cd794.js');
8
8
 
9
9
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
10
 
@@ -13,7 +13,7 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
13
  var TippyTooltip__default = /*#__PURE__*/_interopDefaultLegacy(TippyTooltip);
14
14
 
15
15
  var _templateObject;
16
- var Tooltip$1 = styled__default['default'](TippyTooltip__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 1rem;\n font-weight: 400;\n background: ", ";\n border-radius: 3px;\n pointer-events: default !important;\n .tippy-content {\n padding: 9px 12px;\n }\n\n .tippy-arrow {\n color: ", ";\n }\n\n a {\n color: inherit;\n }\n"])), function (props) {
16
+ var Tooltip$1 = styled__default["default"](TippyTooltip__default["default"]).attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 1rem;\n font-weight: 400;\n background: ", ";\n border-radius: 3px;\n pointer-events: default !important;\n .tippy-content {\n padding: 9px 12px;\n }\n\n .tippy-arrow {\n color: ", ";\n }\n\n a {\n color: inherit;\n }\n"])), function (props) {
17
17
  return props.theme.primaryFontFamily;
18
18
  }, function (props) {
19
19
  return props.theme.getColor('gray-700');
@@ -21,17 +21,17 @@ var Tooltip$1 = styled__default['default'](TippyTooltip__default['default']).att
21
21
  return props.theme.getColor('gray-700');
22
22
  });
23
23
 
24
- var Tooltip = React__default['default'].forwardRef(function Tooltip(_ref, ref) {
24
+ var _excluded = ["content", "interactive", "placement", "duration", "trigger", "visible", "children"];
25
+ var Tooltip = React__default["default"].forwardRef(function Tooltip(_ref, ref) {
25
26
  var content = _ref.content,
26
- interactive = _ref.interactive,
27
- placement = _ref.placement,
28
- duration = _ref.duration,
29
- trigger = _ref.trigger,
30
- visible = _ref.visible,
31
- children = _ref.children,
32
- props = defaultTheme._objectWithoutProperties(_ref, ["content", "interactive", "placement", "duration", "trigger", "visible", "children"]);
33
-
34
- return React__default['default'].createElement("div", null, React__default['default'].createElement(Tooltip$1, defaultTheme._extends({
27
+ interactive = _ref.interactive,
28
+ placement = _ref.placement,
29
+ duration = _ref.duration,
30
+ trigger = _ref.trigger,
31
+ visible = _ref.visible,
32
+ children = _ref.children,
33
+ props = defaultTheme._objectWithoutProperties(_ref, _excluded);
34
+ return React__default["default"].createElement("div", null, React__default["default"].createElement(Tooltip$1, defaultTheme._extends({
35
35
  ref: ref,
36
36
  content: content,
37
37
  interactive: interactive,