@ntbjs/react-components 1.3.0-rc.1 → 1.3.0-rc.11

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.
@@ -5,28 +5,29 @@ var lodash = require('lodash');
5
5
  var React = require('react');
6
6
  var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
7
7
  var ResizeObserver = require('resize-observer-polyfill');
8
- var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-f3de8047.js');
8
+ var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-e6e5cb90.js');
9
9
  var styled = require('styled-components');
10
10
  var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
11
11
  var warningCircle = require('./warning-circle-24522402.js');
12
12
  var Alert = require('./Alert-13b75102.js');
13
- var Badge = require('./Badge-aec841c8.js');
13
+ var Badge = require('./Badge-757b0a39.js');
14
14
  var Popover = require('./Popover-569cd272.js');
15
15
  require('./Tab-f499ecbc.js');
16
- require('./Tabs-a8c77f71.js');
16
+ require('./Tabs-116aa951.js');
17
17
  var Tooltip = require('./Tooltip-66daf6e3.js');
18
- require('./VerificationStatusIcon-6fe95a92.js');
18
+ require('./VerificationStatusIcon-d5bfb67a.js');
19
19
  var ActionButton = require('./ActionButton-46735b89.js');
20
20
  require('./Button-49f82b31.js');
21
21
  require('./Checkbox-68dc38a8.js');
22
- require('./CompactAutocompleteSelect-b68618b3.js');
23
- require('./CompactStarRating-405e4508.js');
24
- require('./CompactTextInput-0d53acdf.js');
22
+ require('./CompactAutocompleteSelect-96137f48.js');
23
+ require('./CompactStarRating-15c1b812.js');
24
+ require('./CompactTextInput-198d0800.js');
25
25
  require('./MultiSelect-efd60232.js');
26
26
  require('./Radio-32d0513a.js');
27
- require('./TextArea-1da16eb4.js');
27
+ require('./TextArea-18fbcc9f.js');
28
28
  require('./TextInput-0d109708.js');
29
29
  require('./Switch-4a41585f.js');
30
+ require('./AsyncSelect-05ae73fb.js');
30
31
  var ContextMenu = require('./ContextMenu-4ec3d9f3.js');
31
32
  var ContextMenuItem = require('./ContextMenuItem-ba2b697e.js');
32
33
  var polished = require('polished');
@@ -0,0 +1,40 @@
1
+ 'use strict';
2
+
3
+ var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
+ var React = require('react');
5
+ var styled = require('styled-components');
6
+ var reactSelectAsyncPaginate = require('react-select-async-paginate');
7
+ var reactSelectCreatable_esm = require('./react-select-creatable.esm-2f23d6c6.js');
8
+
9
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
+
11
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
+ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
+
14
+ var _templateObject;
15
+ var AsyncSelect$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 1rem;\n font-weight: 500;\n"])), function (props) {
16
+ return props.theme.primaryFontFamily;
17
+ });
18
+
19
+ var AsyncSelect = React__default['default'].forwardRef(function AsyncSelect(_ref, forwardedRef) {
20
+ var loadOptions = _ref.loadOptions,
21
+ defaultComponents = _ref.components,
22
+ props = defaultTheme._objectWithoutProperties(_ref, ["loadOptions", "components"]);
23
+
24
+ var asyncPaginateProps = reactSelectAsyncPaginate.useAsyncPaginate({
25
+ loadOptions: loadOptions
26
+ });
27
+ var components = reactSelectAsyncPaginate.useComponents(defaultComponents);
28
+ return React__default['default'].createElement(AsyncSelect$1, defaultTheme._extends({
29
+ ref: forwardedRef
30
+ }, props), React__default['default'].createElement(reactSelectCreatable_esm.CreatableSelect$1, defaultTheme._extends({}, asyncPaginateProps, {
31
+ components: components
32
+ })));
33
+ });
34
+ AsyncSelect.propTypes = process.env.NODE_ENV !== "production" ? {
35
+ loadOptions: defaultTheme.PropTypes.func,
36
+ components: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string])
37
+ } : {};
38
+ AsyncSelect.defaultProps = {};
39
+
40
+ exports.AsyncSelect = AsyncSelect;
@@ -190,7 +190,7 @@ var Badge = React__default['default'].forwardRef(function Badge(_ref, forwardedR
190
190
  });
191
191
  Badge.propTypes = process.env.NODE_ENV !== "production" ? {
192
192
  badgeIcon: defaultTheme.PropTypes.node,
193
- badgeContent: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.string, defaultTheme.PropTypes.number]),
193
+ badgeContent: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.string, defaultTheme.PropTypes.number, defaultTheme.PropTypes.func, defaultTheme.PropTypes.element]),
194
194
  children: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.node, defaultTheme.PropTypes.string]),
195
195
  elevated: defaultTheme.PropTypes.bool,
196
196
  active: defaultTheme.PropTypes.bool,
@@ -5,12 +5,12 @@ var lodash = require('lodash');
5
5
  var nanoid = require('nanoid');
6
6
  var React = require('react');
7
7
  require('./Alert-13b75102.js');
8
- require('./Badge-aec841c8.js');
8
+ require('./Badge-757b0a39.js');
9
9
  require('./Popover-569cd272.js');
10
10
  require('./Tab-f499ecbc.js');
11
- require('./Tabs-a8c77f71.js');
11
+ require('./Tabs-116aa951.js');
12
12
  var Tooltip = require('./Tooltip-66daf6e3.js');
13
- require('./VerificationStatusIcon-6fe95a92.js');
13
+ require('./VerificationStatusIcon-d5bfb67a.js');
14
14
  var styled = require('styled-components');
15
15
  var Select = require('react-select');
16
16
  var reactSelectAsyncPaginate = require('react-select-async-paginate');
@@ -3,12 +3,12 @@
3
3
  var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var React = require('react');
5
5
  require('./Alert-13b75102.js');
6
- require('./Badge-aec841c8.js');
6
+ require('./Badge-757b0a39.js');
7
7
  require('./Popover-569cd272.js');
8
8
  require('./Tab-f499ecbc.js');
9
- require('./Tabs-a8c77f71.js');
9
+ require('./Tabs-116aa951.js');
10
10
  var Tooltip = require('./Tooltip-66daf6e3.js');
11
- require('./VerificationStatusIcon-6fe95a92.js');
11
+ require('./VerificationStatusIcon-d5bfb67a.js');
12
12
  var styled = require('styled-components');
13
13
 
14
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -243,7 +243,7 @@ var CompactStarRating = React__default['default'].forwardRef(function CompactSta
243
243
  setHover(false);
244
244
  },
245
245
  hover: hover && key + 1 <= tempRating,
246
- type: type,
246
+ type: "button",
247
247
  key: key
248
248
  }, iconFill);
249
249
  } else if (viewEmpty) {
@@ -263,7 +263,7 @@ var CompactStarRating = React__default['default'].forwardRef(function CompactSta
263
263
  setHover(false);
264
264
  },
265
265
  hover: hover && key + 1 <= tempRating,
266
- type: type,
266
+ type: "button",
267
267
  key: key
268
268
  }, icon);
269
269
  }
@@ -6,12 +6,12 @@ var nanoid = require('nanoid');
6
6
  var React = require('react');
7
7
  var editNote = require('./edit-note-c47d292e.js');
8
8
  require('./Alert-13b75102.js');
9
- require('./Badge-aec841c8.js');
9
+ require('./Badge-757b0a39.js');
10
10
  require('./Popover-569cd272.js');
11
11
  require('./Tab-f499ecbc.js');
12
- require('./Tabs-a8c77f71.js');
12
+ require('./Tabs-116aa951.js');
13
13
  var Tooltip = require('./Tooltip-66daf6e3.js');
14
- require('./VerificationStatusIcon-6fe95a92.js');
14
+ require('./VerificationStatusIcon-d5bfb67a.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 }; }
@@ -4,8 +4,8 @@ var defaultTheme = require('./defaultTheme-ea44e34a.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-b68618b3.js');
8
- var TextArea = require('./TextArea-1da16eb4.js');
7
+ var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-96137f48.js');
8
+ var TextArea = require('./TextArea-18fbcc9f.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 }; }
@@ -4,12 +4,12 @@ var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
6
  require('./Alert-13b75102.js');
7
- require('./Badge-aec841c8.js');
7
+ require('./Badge-757b0a39.js');
8
8
  var Popover = require('./Popover-569cd272.js');
9
9
  require('./Tab-f499ecbc.js');
10
- require('./Tabs-a8c77f71.js');
10
+ require('./Tabs-116aa951.js');
11
11
  require('./Tooltip-66daf6e3.js');
12
- require('./VerificationStatusIcon-6fe95a92.js');
12
+ require('./VerificationStatusIcon-d5bfb67a.js');
13
13
  var Checkbox = require('./Checkbox-68dc38a8.js');
14
14
  var lodash = require('lodash');
15
15
  var TextInput = require('./TextInput-0d109708.js');
@@ -11,15 +11,19 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
13
 
14
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
14
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
15
15
  var Tabs$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: block;\n position: relative;\n ", ";\n"])), function (props) {
16
16
  return props.backgroundColor && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n background-color: ", ";\n "])), props.backgroundColor);
17
17
  });
18
- var TabHeaders = styled__default['default'].ul.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n overflow-x: auto;\n overflow-y: hidden;\n white-space: nowrap;\n gap: 24px;\n margin: 0;\n padding: 0;\n"])));
19
- var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n text-transform: uppercase;\n font-weight: 600;\n font-size: 0.875rem;\n display: flex;\n padding-bottom: 8px;\n letter-spacing: 0.6px;\n cursor: pointer;\n border-bottom: 1px solid;\n border-color: transparent;\n margin-bottom: 1px;\n\n ", ";\n &&:hover:not(:focus) {\n ", ";\n }\n"])), function (props) {
18
+ var TabHeaders = styled__default['default'].ul.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n overflow-x: auto;\n overflow-y: hidden;\n white-space: nowrap;\n gap: 24px;\n\n margin: 0;\n ", ";\n ", ";\n"])), function (props) {
19
+ return !props.customPadding && styled.css(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n padding: 0;\n "])));
20
+ }, function (props) {
21
+ return props.customPadding && styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n padding: 0 ", ";\n "])), props.customPadding);
22
+ });
23
+ var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n text-transform: uppercase;\n font-weight: 600;\n font-size: 0.875rem;\n display: flex;\n padding-bottom: 8px;\n letter-spacing: 0.6px;\n cursor: pointer;\n border-bottom: 1px solid;\n border-color: transparent;\n margin-bottom: 1px;\n\n ", ";\n &&:hover:not(:focus) {\n ", ";\n }\n"])), function (props) {
20
24
  return props.theme.secondaryFontFamily;
21
25
  }, function (props) {
22
- return props.active && styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
26
+ return props.active && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
23
27
  return props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-700'));
24
28
  });
25
29
  }, function (props) {
@@ -37,29 +41,27 @@ var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultThe
37
41
  }
38
42
  });
39
43
  });
40
- var TabContent = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n border-top: 1px solid;\n margin-top: -2px;\n display: block;\n ", ";\n"])), function (props) {
44
+ var TabContent = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n"])));
45
+ var TabHeaderBorder = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n border-top: 1px solid;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
41
46
  return props.theme.themeProp('border-color', props.theme.getColor('gray-600'), '#F0F2F5');
47
+ }, function (props) {
48
+ return !props.customPadding && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n margin: -2px 0;\n "])));
49
+ }, function (props) {
50
+ return props.customPadding && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n margin: -2px ", ";\n "])), props.customPadding);
42
51
  });
43
52
 
44
53
  var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef) {
45
54
  var children = _ref.children,
46
55
  defaultMinHeight = _ref.defaultMinHeight,
47
- props = defaultTheme._objectWithoutProperties(_ref, ["children", "defaultMinHeight"]);
56
+ customPadding = _ref.customPadding,
57
+ props = defaultTheme._objectWithoutProperties(_ref, ["children", "defaultMinHeight", "customPadding"]);
48
58
 
49
59
  var _useState = React.useState(0),
50
60
  _useState2 = defaultTheme._slicedToArray(_useState, 2),
51
61
  activeTab = _useState2[0],
52
62
  setActiveTab = _useState2[1];
53
63
 
54
- var _useState3 = React.useState(),
55
- _useState4 = defaultTheme._slicedToArray(_useState3, 2),
56
- defaultHeight = _useState4[0],
57
- setDefaultHeight = _useState4[1];
58
-
59
64
  var contentRef = React.useRef(null);
60
- React.useEffect(function () {
61
- setDefaultHeight(defaultMinHeight);
62
- }, []);
63
65
  var tabs = React.useMemo(function () {
64
66
  var tabs = [];
65
67
 
@@ -109,7 +111,9 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
109
111
  ref: forwardedRef
110
112
  }, props, {
111
113
  role: "tablist"
112
- }), React__default['default'].createElement(TabHeaders, null, tabs.map(function (tab) {
114
+ }), React__default['default'].createElement(TabHeaders, {
115
+ customPadding: customPadding
116
+ }, tabs.map(function (tab) {
113
117
  return React__default['default'].createElement(TabHeader, {
114
118
  key: tab.key,
115
119
  hidden: tab.hidden,
@@ -119,25 +123,29 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
119
123
  },
120
124
  role: "tab"
121
125
  }, tab.trigger);
122
- })), React__default['default'].createElement(TabContent, null, tabs.map(function (tab) {
126
+ })), React__default['default'].createElement(TabHeaderBorder, {
127
+ customPadding: customPadding
128
+ }), React__default['default'].createElement(TabContent, null, tabs.map(function (tab) {
123
129
  return React__default['default'].createElement("div", {
124
130
  ref: tab.key === (activeTab === null || activeTab === void 0 ? void 0 : activeTab.key) ? contentRef : null,
125
131
  key: tab.key,
126
132
  role: "tabpanel",
127
133
  hidden: tab.key !== activeTab,
128
134
  style: {
129
- minHeight: !lodash.isEmpty(defaultHeight) ? defaultHeight : ''
135
+ minHeight: !lodash.isEmpty(defaultMinHeight) ? defaultMinHeight : ''
130
136
  }
131
137
  }, tab.content);
132
138
  })));
133
139
  });
134
140
  Tabs.defaultProps = {
135
- defaultMinHeight: ''
141
+ defaultMinHeight: '',
142
+ customPadding: 0
136
143
  };
137
144
  Tabs.propTypes = process.env.NODE_ENV !== "production" ? {
138
145
  children: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.array, defaultTheme.PropTypes.object]),
139
146
  backgroundColor: defaultTheme.PropTypes.string,
140
- defaultMinHeight: defaultTheme.PropTypes.string
147
+ defaultMinHeight: defaultTheme.PropTypes.string,
148
+ customPadding: defaultTheme.PropTypes.string
141
149
  } : {};
142
150
 
143
151
  exports.Tabs = Tabs;
@@ -2,16 +2,16 @@
2
2
 
3
3
  var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var React = require('react');
5
- var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
6
5
  var lodash = require('lodash');
6
+ var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
7
7
  var nanoid = require('nanoid');
8
8
  require('./Alert-13b75102.js');
9
- require('./Badge-aec841c8.js');
9
+ require('./Badge-757b0a39.js');
10
10
  require('./Popover-569cd272.js');
11
11
  require('./Tab-f499ecbc.js');
12
- require('./Tabs-a8c77f71.js');
12
+ require('./Tabs-116aa951.js');
13
13
  var Tooltip = require('./Tooltip-66daf6e3.js');
14
- require('./VerificationStatusIcon-6fe95a92.js');
14
+ require('./VerificationStatusIcon-d5bfb67a.js');
15
15
  var editNote = require('./edit-note-c47d292e.js');
16
16
  var styled = require('styled-components');
17
17
 
@@ -20,7 +20,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
20
20
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
21
21
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
22
22
 
23
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45;
23
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47;
24
24
  var fadeInCheck = styled.keyframes(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 0\n }\n to {\n opacity: 1\n }\n"])));
25
25
  var fadeOutCheck = styled.keyframes(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 1\n }\n to {\n opacity: 0\n }\n"])));
26
26
  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"])));
@@ -29,25 +29,27 @@ var placeholderBaseStyle = styled.css(_templateObject4 || (_templateObject4 = de
29
29
  }, function (props) {
30
30
  return props.theme.themeProp('opacity', 0.6, 0.5);
31
31
  });
32
- 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) {
33
- return props.theme.themeProp('background-color', props.theme.getColor('gray-900'), props.theme.getColor('gray-300'), '!important');
32
+ var TextAreaContainter = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n"])));
33
+ var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n flex-basis: 33.33%;\n font-size: 0.875rem;\n line-height: 1rem;\n height: 19px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-top: 13px;\n ", "\n"])), function (props) {
34
+ return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
34
35
  }, function (props) {
35
- return props.disabled && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
36
+ return props.disabled && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
36
37
  });
37
- var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 5px 10px;\n resize: vertical;\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n border: 1px solid;\n ", "\n \n\n ", "\n\n \n \n\n 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) {
38
- return props.showMore && !props.expanded && props.defaultHeight < props.maxHeight && styled.css(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n -webkit-mask-image: linear-gradient(0deg, transparent 5px, white 45px);\n "])));
38
+ 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 display: flex;\n align-items: flex-start;\n\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) {
39
+ return props.theme.themeProp('background-color', props.theme.getColor('gray-900'), props.theme.getColor('gray-300'), '!important');
39
40
  }, function (props) {
40
- return props.borderRadius && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n border-radius: ", "px;\n "])), props.borderRadius);
41
+ return props.disabled && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
42
+ });
43
+ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 5px 10px;\n resize: vertical;\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n border: 1px solid;\n\n \n\n ", "\n\n \n \n\n 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) {
44
+ return props.borderRadius && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n border-radius: ", "px;\n "])), props.borderRadius);
41
45
  }, function (props) {
42
46
  return props.theme.themeProp('color', 'white', 'black');
43
47
  }, function (props) {
44
- return props.readOnly && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n cursor: default;\n border-color: transparent !important;\n "])));
48
+ return props.readOnly && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n cursor: default;\n border-color: transparent !important;\n "])));
45
49
  }, function (props) {
46
- return props.disabled && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
50
+ return props.disabled && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
47
51
  }, function (props) {
48
- return props.readOnly && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n padding: 12px 10px; ;\n "])));
49
- }, function (props) {
50
- return props.showMore && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n overflow: hidden;\n "])));
52
+ return props.readOnly && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n padding: 12px 10px; ;\n "])));
51
53
  }, function (props) {
52
54
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
53
55
  }, function (props) {
@@ -57,39 +59,39 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
57
59
  }, function (props) {
58
60
  return props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-400'));
59
61
  }, function (props) {
60
- return props.noBorder && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
62
+ return props.noBorder && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
61
63
  return props.theme.themeProp('border-color', props.theme.getColor('gray-900'), props.theme.getColor('white'));
62
64
  });
63
65
  }, function (props) {
64
- return props.type === 'warning' && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', '#EAB308', 'black'), props.theme.themeProp('background', '#2F2402', '#F2D16B'), props.theme.themeProp('border-color', '#2F2402 ', '#F2D16B'));
66
+ return props.type === 'warning' && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', '#EAB308', 'black'), props.theme.themeProp('background', '#2F2402', '#F2D16B'), props.theme.themeProp('border-color', '#2F2402 ', '#F2D16B'));
65
67
  }, function (props) {
66
- return props.type === 'error' && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#7f1b1b', '#FBEAE6'), props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6'));
68
+ return props.type === 'error' && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#7f1b1b', '#FBEAE6'), props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6'));
67
69
  }, function (props) {
68
- return props.noBorder && props.type === 'warning' && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
70
+ return props.noBorder && props.type === 'warning' && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
69
71
  return props.theme.themeProp('border-color', '#2F2402', '#F2D16B');
70
72
  });
71
73
  }, function (props) {
72
- return props.noBorder && props.type === 'error' && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
74
+ return props.noBorder && props.type === 'error' && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
73
75
  return props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6');
74
76
  });
75
77
  }, function (props) {
76
- return props.type === 'warning-border' && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
78
+ return props.type === 'warning-border' && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
77
79
  }, function (props) {
78
- return props.type === 'error-border' && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
80
+ return props.type === 'error-border' && styled.css(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
79
81
  }, function (props) {
80
- return props.lightBackground && styled.css(_templateObject21 || (_templateObject21 = 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'));
82
+ return props.lightBackground && styled.css(_templateObject22 || (_templateObject22 = 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'));
81
83
  }, function (props) {
82
84
  return props.edit && props.type != 'warning' && props.theme.themeProp('background', '#505050', '#eff1f4');
83
85
  }, function (props) {
84
86
  return props.edit && props.type === 'warning' && props.theme.themeProp('background', '#AD8800', '#FFF3A7');
85
87
  }, function (props) {
86
- return props.padding === 'small' && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n padding: 5px 10px;\n "])));
88
+ return props.padding === 'small' && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n padding: 5px 10px;\n "])));
87
89
  }, function (props) {
88
- return props.padding === 'medium' && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n padding: 13px 15px;\n "])));
90
+ return props.padding === 'medium' && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n padding: 13px 15px;\n "])));
89
91
  }, function (props) {
90
- return props.padding === 'large' && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n padding: 15px 55px;\n "])));
92
+ return props.padding === 'large' && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n padding: 15px 55px;\n "])));
91
93
  }, function (props) {
92
- return props.hasIcon && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-right: 35px;\n padding-top: 13.5px;\n "])));
94
+ return props.hasIcon && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-right: 35px;\n padding-top: 13.5px;\n "])));
93
95
  }, function (props) {
94
96
  return !props.readOnly && !props.disabled && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
95
97
  }, function (props) {
@@ -101,7 +103,7 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
101
103
  }, function (props) {
102
104
  return props.noBorder && !props.readOnly && props.type != 'warning' && props.type != 'error' ? props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')) : 'background: transparent';
103
105
  }, InputIconContainer, function (props) {
104
- return props.type === 'success' && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
106
+ return props.type === 'success' && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
105
107
  }, function (props) {
106
108
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'), 1);
107
109
  }, function (props) {
@@ -111,11 +113,11 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
111
113
  }, function (props) {
112
114
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
113
115
  }, function (props) {
114
- return props.type === 'warning' && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
116
+ return props.type === 'warning' && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
115
117
  return props.theme.themeProp('border-color', '#F4E21E', '#F4E21E');
116
118
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
117
119
  }, function (props) {
118
- return props.type === 'error' && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
120
+ return props.type === 'error' && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
119
121
  return props.theme.themeProp('border-color', '#D83018', '#D83018');
120
122
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
121
123
  }, function (props) {
@@ -123,56 +125,65 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
123
125
  }, function (props) {
124
126
  return props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)');
125
127
  }, function (props) {
126
- return props.noBorder && props.edit && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
128
+ return props.noBorder && props.edit && styled.css(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
127
129
  return props.theme.themeProp('border-color', '#27272A', 'rgba(244,244,245, 0.3)');
128
130
  });
129
131
  }, function (props) {
130
132
  return props.edit && props.type === 'warning' && props.theme.themeProp('background', '#2F2402', '#FFF3A7');
131
133
  });
132
- 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) {
134
+ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = 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) {
133
135
  return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
134
136
  }, placeholderBaseStyle, function (props) {
135
137
  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%)"));
136
138
  }, function (props) {
137
- return !props.inputIsEmpty && styled.css(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), activeLabel);
139
+ return !props.inputIsEmpty && styled.css(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), activeLabel);
138
140
  }, function (props) {
139
- return props.hasPlaceholder && styled.css(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n "])), activeLabel);
141
+ return props.hasPlaceholder && styled.css(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n "])), activeLabel);
140
142
  }, function (props) {
141
- return props.hasIcon && styled.css(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
143
+ return props.hasIcon && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
142
144
  });
143
- 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"])));
144
- 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) {
145
+ var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = 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"])));
146
+ var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = 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: 12px;\n width: 15px;\n }\n"])), function (props) {
145
147
  return props.type === 'warning' && props.theme.themeProp('color', '#EAB308', '#2F2402');
146
148
  });
147
- 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) {
148
- return props.readOnly && styled.css(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n pointer-events: none;\n "])));
149
+ var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n flex-basis: ", ";\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) {
150
+ return props.$fieldLabel ? '66.66%' : '100%';
151
+ }, function (props) {
152
+ return props.readOnly && styled.css(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n pointer-events: none;\n "])));
149
153
  }, function (props) {
150
- return props.disabled && styled.css(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
154
+ return props.disabled && styled.css(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
151
155
  }, TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
152
156
  return props.type === 'error' && props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500'));
153
157
  });
154
- 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) {
158
+ var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject40 || (_templateObject40 = 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) {
155
159
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
156
160
  }, function (props) {
157
- 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')));
161
+ return (props.type === 'warning-border' || props.type === 'warning') && styled.css(_templateObject41 || (_templateObject41 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('orange-500')));
162
+ }, function (props) {
163
+ return (props.type === 'error-border' || props.type === 'error') && styled.css(_templateObject42 || (_templateObject42 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
164
+ });
165
+ var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject43 || (_templateObject43 = 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) {
166
+ return props.fadeIn ? 0 : 1;
167
+ }, function (props) {
168
+ return props.fadeIn ? fadeOutCheck : fadeInCheck;
158
169
  }, function (props) {
159
- 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')));
170
+ return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
160
171
  });
161
- 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) {
172
+ var SuccessContainerLabel = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject44 || (_templateObject44 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n margin-right: 5px;\n margin-top: -7px;\n width: 15px;\n height: 15px;\n padding: 5px;\n ", "\n\n > svg {\n width: 13px;\n }\n"])), function (props) {
162
173
  return props.fadeIn ? 0 : 1;
163
174
  }, function (props) {
164
175
  return props.fadeIn ? fadeOutCheck : fadeInCheck;
165
176
  }, function (props) {
166
177
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
167
178
  });
168
- 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) {
169
- return props.expanded && styled.css(_templateObject44 || (_templateObject44 = defaultTheme._taggedTemplateLiteral(["\n margin-top: 0px;\n "])));
179
+ styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject45 || (_templateObject45 = defaultTheme._taggedTemplateLiteral(["\n margin-top: -18px;\n margin-bottom: 0;\n display: block;\n position: absolute;\n font-size: 0.875rem;\n cursor: pointer;\n padding: 2px 10px;\n margin-right: 10px;\n margin-top: -26px;\n ", "\n transition: margin-top 550ms ease-in-out;\n -webkit-mask-image: linear-gradient(180deg, transparent 1px, white 7px);\n ", "\n\n ", ";\n\n ", "\n"])), function (props) {
180
+ return props.expanded && styled.css(_templateObject46 || (_templateObject46 = defaultTheme._taggedTemplateLiteral(["\n margin-top: 0px;\n "])));
170
181
  }, function (props) {
171
182
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
172
183
  }, function (props) {
173
184
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('emerald-500'));
174
185
  }, function (props) {
175
- 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')));
186
+ return props.type === 'error' && styled.css(_templateObject47 || (_templateObject47 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
176
187
  });
177
188
 
178
189
  var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forwardedRef) {
@@ -186,9 +197,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
186
197
  hidden = _ref.hidden,
187
198
  readOnly = _ref.readOnly,
188
199
  edit = _ref.edit,
189
- showMore = _ref.showMore,
190
- showMoreText = _ref.showMoreText,
191
- showLessText = _ref.showLessText,
192
200
  autoComplete = _ref.autoComplete,
193
201
  description = _ref.description,
194
202
  type = _ref.type,
@@ -201,13 +209,13 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
201
209
  lightBackground = _ref.lightBackground,
202
210
  noBorder = _ref.noBorder,
203
211
  instructionsTextArea = _ref.instructionsTextArea,
204
- isExpanded = _ref.isExpanded,
205
212
  loadingIcon = _ref.loadingIcon,
206
213
  successIcon = _ref.successIcon,
207
214
  padding = _ref.padding,
208
215
  descriptionToolTip = _ref.descriptionToolTip,
209
216
  borderRadius = _ref.borderRadius,
210
- 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", "isExpanded", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius"]);
217
+ fieldLabel = _ref.fieldLabel,
218
+ rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "autoComplete", "description", "type", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius", "fieldLabel"]);
211
219
 
212
220
  var textInputDomNode = React.useRef(null);
213
221
  var textInputRef = useMergedRefs.useMergedRefs(forwardedRef, textInputDomNode);
@@ -217,114 +225,33 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
217
225
  inputIsEmpty = _useState2[0],
218
226
  setInputIsEmpty = _useState2[1];
219
227
 
220
- var _useState3 = React.useState(''),
228
+ var _useState3 = React.useState(false),
221
229
  _useState4 = defaultTheme._slicedToArray(_useState3, 2),
222
- maxContentRows = _useState4[0],
223
- setMaxContentRows = _useState4[1];
224
-
225
- var _useState5 = React.useState(false),
226
- _useState6 = defaultTheme._slicedToArray(_useState5, 2),
227
- expanded = _useState6[0],
228
- setExpanded = _useState6[1];
229
-
230
- var _useState7 = React.useState(''),
231
- _useState8 = defaultTheme._slicedToArray(_useState7, 2),
232
- maxHeight = _useState8[0],
233
- setMaxHeight = _useState8[1];
234
-
235
- var _useState9 = React.useState(''),
236
- _useState10 = defaultTheme._slicedToArray(_useState9, 2),
237
- defaultHeight = _useState10[0],
238
- setDefaultHeight = _useState10[1];
230
+ autoFocus = _useState4[0],
231
+ setAutoFocus = _useState4[1];
239
232
 
240
- var _useState11 = React.useState(false),
241
- _useState12 = defaultTheme._slicedToArray(_useState11, 2),
242
- autoFocus = _useState12[0],
243
- setAutoFocus = _useState12[1];
244
-
245
- var _useState13 = React.useState(false),
246
- _useState14 = defaultTheme._slicedToArray(_useState13, 2),
247
- isInputHeightMore = _useState14[0],
248
- setIsInputHeightMore = _useState14[1];
249
-
250
- var _useState15 = React.useState(nanoid.nanoid()),
251
- _useState16 = defaultTheme._slicedToArray(_useState15, 1),
252
- uniqueId = _useState16[0];
233
+ var _useState5 = React.useState(nanoid.nanoid()),
234
+ _useState6 = defaultTheme._slicedToArray(_useState5, 1),
235
+ uniqueId = _useState6[0];
253
236
 
254
237
  var memoizedDescriptionToolTip = React.useMemo(function () {
255
238
  return descriptionToolTip;
256
239
  }, [descriptionToolTip]);
257
240
  React.useEffect(function () {
258
- if (lodash.isEmpty(value) || lodash.isEmpty(defaultValue)) {
259
- setExpanded(false);
260
- }
261
- }, [value, defaultValue]);
262
- React.useEffect(function () {
263
- setExpanded(false);
264
- isExpanded(false);
265
241
  setAutoFocus(false);
266
242
  }, [value, defaultValue]);
267
-
268
- var handleTextAreaChange = function handleTextAreaChange() {
269
- setExpanded(true);
270
- isExpanded(true);
271
- };
272
-
273
- var handleTextAreaShowLess = function handleTextAreaShowLess() {
274
- setExpanded(!expanded);
275
- isExpanded(!expanded);
276
- };
277
-
278
- var calculateRows = function calculateRows() {
279
- var textareaRefCurrent = textInputDomNode === null || textInputDomNode === void 0 ? void 0 : textInputDomNode.current;
280
-
281
- if (textareaRefCurrent !== null) {
282
- var textAreaHeight = textareaRefCurrent === null || textareaRefCurrent === void 0 ? void 0 : textareaRefCurrent.scrollHeight;
283
- var lineHeight = 12;
284
- var calculatedRows = Math.floor(textAreaHeight / lineHeight);
285
- var defaultRowsHeight = rows * 20;
286
- setMaxContentRows(calculatedRows);
287
-
288
- if (calculatedRows > rows) {
289
- setDefaultHeight(defaultRowsHeight);
290
- setMaxHeight(textAreaHeight);
291
- } else {
292
- setMaxHeight();
293
- }
294
- }
295
- };
296
-
297
- React.useEffect(function () {
298
- calculateRows();
299
- }, [value, defaultValue]);
300
243
  var onKeyDown = React.useCallback(function (event) {
301
244
  if (event.key === 'Enter') {
302
245
  event.stopPropagation();
303
246
  }
304
247
  }, []);
305
248
 
306
- var onChangeHeight = function onChangeHeight(e) {
307
- var textareaRefCurrent = textInputDomNode === null || textInputDomNode === void 0 ? void 0 : textInputDomNode.current;
308
- var newValue = e.target.value;
309
-
310
- if (textareaRefCurrent !== null) {
311
- textareaRefCurrent.value = newValue;
312
- var heightOnInput = textareaRefCurrent === null || textareaRefCurrent === void 0 ? void 0 : textareaRefCurrent.scrollHeight;
313
- var defaultRowsHeight = rows * 20;
314
-
315
- if (heightOnInput > defaultRowsHeight) {
316
- setMaxHeight(heightOnInput);
317
- setIsInputHeightMore(false);
318
- }
319
-
320
- if (heightOnInput < defaultHeight) {
321
- setIsInputHeightMore(true);
322
- }
323
- }
324
- };
325
-
326
249
  var input = function input() {
327
- return React__default['default'].createElement(TextInput, {
250
+ return React__default['default'].createElement(TextAreaContainter, null, fieldLabel && React__default['default'].createElement(Label, {
251
+ htmlFor: uniqueId,
252
+ disabled: disabled
253
+ }, fieldLabel, React__default['default'].createElement(SuccessContainerLabel, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), React__default['default'].createElement(TextInput, {
254
+ $fieldLabel: !lodash.isEmpty(fieldLabel),
328
255
  disabled: disabled,
329
256
  readOnly: readOnly,
330
257
  type: type,
@@ -333,16 +260,10 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
333
260
  }, React__default['default'].createElement(TextInputFieldIconAlert, {
334
261
  type: type
335
262
  }, icon), React__default['default'].createElement(TextInputField, defaultTheme._extends({
336
- style: {
337
- height: expanded ? "".concat(maxHeight, "px") : "".concat(defaultHeight, "px")
338
- },
339
263
  autoFocus: autoFocus,
340
264
  borderRadius: borderRadius,
341
265
  ref: textInputRef,
342
266
  rows: rows,
343
- expanded: expanded,
344
- defaultHeight: defaultHeight,
345
- maxHeight: maxHeight,
346
267
  value: value,
347
268
  defaultValue: defaultValue,
348
269
  name: name,
@@ -352,7 +273,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
352
273
  disabled: disabled,
353
274
  edit: edit,
354
275
  instructionsTextArea: instructionsTextArea,
355
- showMore: showMore,
356
276
  type: type,
357
277
  autoComplete: autoComplete,
358
278
  hasIcon: Boolean(icon),
@@ -377,15 +297,11 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
377
297
  }
378
298
 
379
299
  _onChange(e);
380
-
381
- onChangeHeight(e);
382
300
  },
383
301
  onKeyDown: onKeyDown,
384
302
  onBlur: onBlur,
385
303
  noBorder: noBorder
386
- }, rest, {
387
- onClick: showMore ? handleTextAreaChange : undefined
388
- })), (type === 'loading' || type === 'success') && React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
304
+ }, rest)), !fieldLabel && (type === 'loading' || type === 'success') && React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
389
305
  disabled: disabled
390
306
  }, React__default['default'].createElement(editNote.SvgEditNote, {
391
307
  className: padding === 'small' ? 'smallPadingIcon' : undefined
@@ -396,10 +312,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
396
312
  inputIsEmpty: inputIsEmpty
397
313
  }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
398
314
  type: type
399
- }, description), maxContentRows > rows && showMore && !isInputHeightMore && React__default['default'].createElement(ShowMoreText, {
400
- onClick: showMore ? handleTextAreaShowLess : undefined,
401
- expanded: expanded
402
- }, !expanded ? showMoreText : showLessText));
315
+ }, description)));
403
316
  };
404
317
 
405
318
  if (hidden) return null;
@@ -417,9 +330,6 @@ TextArea.defaultProps = {
417
330
  readOnly: false,
418
331
  edit: false,
419
332
  hidden: false,
420
- showMore: false,
421
- showMoreText: '',
422
- showLessText: '',
423
333
  type: '',
424
334
  padding: 'medium',
425
335
  instructionsTextArea: false,
@@ -433,14 +343,12 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
433
343
  defaultValue: defaultTheme.PropTypes.string,
434
344
  name: defaultTheme.PropTypes.string,
435
345
  label: defaultTheme.PropTypes.string,
346
+ fieldLabel: defaultTheme.PropTypes.string,
436
347
  placeholder: defaultTheme.PropTypes.string,
437
348
  required: defaultTheme.PropTypes.bool,
438
349
  disabled: defaultTheme.PropTypes.bool,
439
350
  hidden: defaultTheme.PropTypes.bool,
440
351
  readOnly: defaultTheme.PropTypes.bool,
441
- showMore: defaultTheme.PropTypes.bool,
442
- showMoreText: defaultTheme.PropTypes.string,
443
- showLessText: defaultTheme.PropTypes.string,
444
352
  edit: defaultTheme.PropTypes.bool,
445
353
  autoComplete: defaultTheme.PropTypes.string,
446
354
  description: defaultTheme.PropTypes.string,
@@ -68,6 +68,9 @@ var VerificationStatusColor = styled__default['default'].div.attrs(defaultTheme.
68
68
  } else if (props.status === 'rejected') {
69
69
  darkThemeColor = props.theme.getColor('red-600');
70
70
  lightThemeColor = props.theme.getColor('red-600');
71
+ } else if (props.status === 'mixed') {
72
+ darkThemeColor = '#008CDB';
73
+ lightThemeColor = '#008CDB';
71
74
  }
72
75
 
73
76
  return props.theme.themeProp('background-color', darkThemeColor, lightThemeColor);
@@ -106,7 +109,7 @@ var VerificationStatusIcon = React__default['default'].forwardRef(function Verif
106
109
  })));
107
110
  });
108
111
  VerificationStatusIcon.propTypes = process.env.NODE_ENV !== "production" ? {
109
- status: defaultTheme.PropTypes.oneOf(['verified', 'pending', 'rejected']).isRequired,
112
+ status: defaultTheme.PropTypes.oneOf(['verified', 'pending', 'rejected', 'mixed']).isRequired,
110
113
  iconHeight: defaultTheme.PropTypes.number,
111
114
  background: defaultTheme.PropTypes.bool
112
115
  } : {};
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Badge = require('../../Badge-aec841c8.js');
3
+ var Badge = require('../../Badge-757b0a39.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('react');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Tabs = require('../../Tabs-a8c77f71.js');
3
+ var Tabs = require('../../Tabs-116aa951.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
package/data/index.js CHANGED
@@ -3,12 +3,12 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var Alert = require('../Alert-13b75102.js');
6
- var Badge = require('../Badge-aec841c8.js');
6
+ var Badge = require('../Badge-757b0a39.js');
7
7
  var Popover = require('../Popover-569cd272.js');
8
8
  var Tab = require('../Tab-f499ecbc.js');
9
- var Tabs = require('../Tabs-a8c77f71.js');
9
+ var Tabs = require('../Tabs-116aa951.js');
10
10
  var Tooltip = require('../Tooltip-66daf6e3.js');
11
- var VerificationStatusIcon = require('../VerificationStatusIcon-6fe95a92.js');
11
+ var VerificationStatusIcon = require('../VerificationStatusIcon-d5bfb67a.js');
12
12
  require('../defaultTheme-ea44e34a.js');
13
13
  require('styled-components');
14
14
  require('react');
@@ -0,0 +1,13 @@
1
+ 'use strict';
2
+
3
+ var AsyncSelect = require('../../AsyncSelect-05ae73fb.js');
4
+ require('../../defaultTheme-ea44e34a.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('react-select-async-paginate');
8
+ require('../../react-select-creatable.esm-2f23d6c6.js');
9
+ require('react-dom');
10
+
11
+
12
+
13
+ module.exports = AsyncSelect.AsyncSelect;
@@ -1,22 +1,22 @@
1
1
  'use strict';
2
2
 
3
- var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-b68618b3.js');
3
+ var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-96137f48.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('nanoid');
8
8
  require('react');
9
9
  require('../../Alert-13b75102.js');
10
- require('../../Badge-aec841c8.js');
10
+ require('../../Badge-757b0a39.js');
11
11
  require('../../Popover-569cd272.js');
12
12
  require('polished');
13
13
  require('@tippyjs/react');
14
14
  require('../../shift-away-subtle-0bed9a3c.js');
15
15
  require('popper-max-size-modifier');
16
16
  require('../../Tab-f499ecbc.js');
17
- require('../../Tabs-a8c77f71.js');
17
+ require('../../Tabs-116aa951.js');
18
18
  require('../../Tooltip-66daf6e3.js');
19
- require('../../VerificationStatusIcon-6fe95a92.js');
19
+ require('../../VerificationStatusIcon-d5bfb67a.js');
20
20
  require('react-select');
21
21
  require('react-select-async-paginate');
22
22
  require('../../react-select-creatable.esm-2f23d6c6.js');
@@ -1,21 +1,21 @@
1
1
  'use strict';
2
2
 
3
- var CompactStarRating = require('../../CompactStarRating-405e4508.js');
3
+ var CompactStarRating = require('../../CompactStarRating-15c1b812.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('react');
7
7
  require('../../Alert-13b75102.js');
8
8
  require('lodash');
9
- require('../../Badge-aec841c8.js');
9
+ require('../../Badge-757b0a39.js');
10
10
  require('../../Popover-569cd272.js');
11
11
  require('polished');
12
12
  require('@tippyjs/react');
13
13
  require('../../shift-away-subtle-0bed9a3c.js');
14
14
  require('popper-max-size-modifier');
15
15
  require('../../Tab-f499ecbc.js');
16
- require('../../Tabs-a8c77f71.js');
16
+ require('../../Tabs-116aa951.js');
17
17
  require('../../Tooltip-66daf6e3.js');
18
- require('../../VerificationStatusIcon-6fe95a92.js');
18
+ require('../../VerificationStatusIcon-d5bfb67a.js');
19
19
 
20
20
 
21
21
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var CompactTextInput = require('../../CompactTextInput-0d53acdf.js');
3
+ var CompactTextInput = require('../../CompactTextInput-198d0800.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -8,16 +8,16 @@ require('nanoid');
8
8
  require('react');
9
9
  require('../../edit-note-c47d292e.js');
10
10
  require('../../Alert-13b75102.js');
11
- require('../../Badge-aec841c8.js');
11
+ require('../../Badge-757b0a39.js');
12
12
  require('../../Popover-569cd272.js');
13
13
  require('polished');
14
14
  require('@tippyjs/react');
15
15
  require('../../shift-away-subtle-0bed9a3c.js');
16
16
  require('popper-max-size-modifier');
17
17
  require('../../Tab-f499ecbc.js');
18
- require('../../Tabs-a8c77f71.js');
18
+ require('../../Tabs-116aa951.js');
19
19
  require('../../Tooltip-66daf6e3.js');
20
- require('../../VerificationStatusIcon-6fe95a92.js');
20
+ require('../../VerificationStatusIcon-d5bfb67a.js');
21
21
 
22
22
 
23
23
 
@@ -1,23 +1,23 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-1da16eb4.js');
3
+ var TextArea = require('../../TextArea-18fbcc9f.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('react');
7
- require('../../useMergedRefs-b6d2f8fc.js');
8
7
  require('lodash');
8
+ require('../../useMergedRefs-b6d2f8fc.js');
9
9
  require('nanoid');
10
10
  require('../../Alert-13b75102.js');
11
- require('../../Badge-aec841c8.js');
11
+ require('../../Badge-757b0a39.js');
12
12
  require('../../Popover-569cd272.js');
13
13
  require('polished');
14
14
  require('@tippyjs/react');
15
15
  require('../../shift-away-subtle-0bed9a3c.js');
16
16
  require('popper-max-size-modifier');
17
17
  require('../../Tab-f499ecbc.js');
18
- require('../../Tabs-a8c77f71.js');
18
+ require('../../Tabs-116aa951.js');
19
19
  require('../../Tooltip-66daf6e3.js');
20
- require('../../VerificationStatusIcon-6fe95a92.js');
20
+ require('../../VerificationStatusIcon-d5bfb67a.js');
21
21
  require('../../edit-note-c47d292e.js');
22
22
 
23
23
 
package/inputs/index.js CHANGED
@@ -5,15 +5,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var ActionButton = require('../ActionButton-46735b89.js');
6
6
  var Button = require('../Button-49f82b31.js');
7
7
  var Checkbox = require('../Checkbox-68dc38a8.js');
8
- var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-b68618b3.js');
9
- var CompactStarRating = require('../CompactStarRating-405e4508.js');
10
- var CompactTextInput = require('../CompactTextInput-0d53acdf.js');
8
+ var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-96137f48.js');
9
+ var CompactStarRating = require('../CompactStarRating-15c1b812.js');
10
+ var CompactTextInput = require('../CompactTextInput-198d0800.js');
11
11
  var MultiSelect = require('../MultiSelect-efd60232.js');
12
12
  var Radio = require('../Radio-32d0513a.js');
13
- var TextArea = require('../TextArea-1da16eb4.js');
13
+ var TextArea = require('../TextArea-18fbcc9f.js');
14
14
  var TextInput = require('../TextInput-0d109708.js');
15
15
  var Switch = require('../Switch-4a41585f.js');
16
- var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-f3de8047.js');
16
+ var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-e6e5cb90.js');
17
+ var AsyncSelect = require('../AsyncSelect-05ae73fb.js');
17
18
  require('../defaultTheme-ea44e34a.js');
18
19
  require('styled-components');
19
20
  require('react');
@@ -27,11 +28,11 @@ require('../ContextMenu-4ec3d9f3.js');
27
28
  require('../expand-more-94585605.js');
28
29
  require('nanoid');
29
30
  require('../Alert-13b75102.js');
30
- require('../Badge-aec841c8.js');
31
+ require('../Badge-757b0a39.js');
31
32
  require('../Tab-f499ecbc.js');
32
- require('../Tabs-a8c77f71.js');
33
+ require('../Tabs-116aa951.js');
33
34
  require('../Tooltip-66daf6e3.js');
34
- require('../VerificationStatusIcon-6fe95a92.js');
35
+ require('../VerificationStatusIcon-d5bfb67a.js');
35
36
  require('react-select');
36
37
  require('react-select-async-paginate');
37
38
  require('../react-select-creatable.esm-2f23d6c6.js');
@@ -57,3 +58,4 @@ exports.TextInput = TextInput.TextInput;
57
58
  exports.Switch = Switch.Switch;
58
59
  exports.MultiLevelCheckbox = MultiLevelCheckboxSelect.MultiLevelCheckbox;
59
60
  exports.MultiLevelCheckboxSelect = MultiLevelCheckboxSelect.MultiLevelCheckboxSelect;
61
+ exports.AsyncSelect = AsyncSelect.AsyncSelect;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.3.0-rc.1",
3
+ "version": "1.3.0-rc.11",
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",
@@ -1,24 +1,24 @@
1
1
  'use strict';
2
2
 
3
- var AssetGallery = require('../../AssetGallery-8462760f.js');
3
+ var AssetGallery = require('../../AssetGallery-3c1df3b9.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('react');
8
8
  require('../../useMergedRefs-b6d2f8fc.js');
9
9
  require('resize-observer-polyfill');
10
- require('../../MultiLevelCheckboxSelect-f3de8047.js');
10
+ require('../../MultiLevelCheckboxSelect-e6e5cb90.js');
11
11
  require('../../Alert-13b75102.js');
12
- require('../../Badge-aec841c8.js');
12
+ require('../../Badge-757b0a39.js');
13
13
  require('../../Popover-569cd272.js');
14
14
  require('polished');
15
15
  require('@tippyjs/react');
16
16
  require('../../shift-away-subtle-0bed9a3c.js');
17
17
  require('popper-max-size-modifier');
18
18
  require('../../Tab-f499ecbc.js');
19
- require('../../Tabs-a8c77f71.js');
19
+ require('../../Tabs-116aa951.js');
20
20
  require('../../Tooltip-66daf6e3.js');
21
- require('../../VerificationStatusIcon-6fe95a92.js');
21
+ require('../../VerificationStatusIcon-d5bfb67a.js');
22
22
  require('../../Checkbox-68dc38a8.js');
23
23
  require('nanoid');
24
24
  require('../../TextInput-0d109708.js');
@@ -32,17 +32,18 @@ require('../../ActionButton-46735b89.js');
32
32
  require('../../Button-49f82b31.js');
33
33
  require('../../ContextMenu-4ec3d9f3.js');
34
34
  require('../../expand-more-94585605.js');
35
- require('../../CompactAutocompleteSelect-b68618b3.js');
35
+ require('../../CompactAutocompleteSelect-96137f48.js');
36
36
  require('react-select');
37
37
  require('react-select-async-paginate');
38
38
  require('../../react-select-creatable.esm-2f23d6c6.js');
39
39
  require('react-dom');
40
- require('../../CompactStarRating-405e4508.js');
41
- require('../../CompactTextInput-0d53acdf.js');
40
+ require('../../CompactStarRating-15c1b812.js');
41
+ require('../../CompactTextInput-198d0800.js');
42
42
  require('../../MultiSelect-efd60232.js');
43
43
  require('../../Radio-32d0513a.js');
44
- require('../../TextArea-1da16eb4.js');
44
+ require('../../TextArea-18fbcc9f.js');
45
45
  require('../../Switch-4a41585f.js');
46
+ require('../../AsyncSelect-05ae73fb.js');
46
47
  require('../../ContextMenuItem-ba2b697e.js');
47
48
 
48
49
 
@@ -1,31 +1,31 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-c5f3b7d6.js');
3
+ var Instructions = require('../../Instructions-2babb8a3.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('react');
8
8
  require('../../warning-circle-24522402.js');
9
- require('../../CompactAutocompleteSelect-b68618b3.js');
9
+ require('../../CompactAutocompleteSelect-96137f48.js');
10
10
  require('nanoid');
11
11
  require('../../Alert-13b75102.js');
12
- require('../../Badge-aec841c8.js');
12
+ require('../../Badge-757b0a39.js');
13
13
  require('../../Popover-569cd272.js');
14
14
  require('polished');
15
15
  require('@tippyjs/react');
16
16
  require('../../shift-away-subtle-0bed9a3c.js');
17
17
  require('popper-max-size-modifier');
18
18
  require('../../Tab-f499ecbc.js');
19
- require('../../Tabs-a8c77f71.js');
19
+ require('../../Tabs-116aa951.js');
20
20
  require('../../Tooltip-66daf6e3.js');
21
- require('../../VerificationStatusIcon-6fe95a92.js');
21
+ require('../../VerificationStatusIcon-d5bfb67a.js');
22
22
  require('react-select');
23
23
  require('react-select-async-paginate');
24
24
  require('../../react-select-creatable.esm-2f23d6c6.js');
25
25
  require('react-dom');
26
26
  require('../../close-ebf2f3cf.js');
27
27
  require('../../expand-more-94585605.js');
28
- require('../../TextArea-1da16eb4.js');
28
+ require('../../TextArea-18fbcc9f.js');
29
29
  require('../../useMergedRefs-b6d2f8fc.js');
30
30
  require('../../edit-note-c47d292e.js');
31
31
 
package/widgets/index.js CHANGED
@@ -2,28 +2,28 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var AssetGallery = require('../AssetGallery-8462760f.js');
5
+ var AssetGallery = require('../AssetGallery-3c1df3b9.js');
6
6
  var ContextMenu = require('../ContextMenu-4ec3d9f3.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-912c3469.js');
8
- var Instructions = require('../Instructions-c5f3b7d6.js');
8
+ var Instructions = require('../Instructions-2babb8a3.js');
9
9
  require('../defaultTheme-ea44e34a.js');
10
10
  require('styled-components');
11
11
  require('lodash');
12
12
  require('react');
13
13
  require('../useMergedRefs-b6d2f8fc.js');
14
14
  require('resize-observer-polyfill');
15
- require('../MultiLevelCheckboxSelect-f3de8047.js');
15
+ require('../MultiLevelCheckboxSelect-e6e5cb90.js');
16
16
  require('../Alert-13b75102.js');
17
- require('../Badge-aec841c8.js');
17
+ require('../Badge-757b0a39.js');
18
18
  require('../Popover-569cd272.js');
19
19
  require('polished');
20
20
  require('@tippyjs/react');
21
21
  require('../shift-away-subtle-0bed9a3c.js');
22
22
  require('popper-max-size-modifier');
23
23
  require('../Tab-f499ecbc.js');
24
- require('../Tabs-a8c77f71.js');
24
+ require('../Tabs-116aa951.js');
25
25
  require('../Tooltip-66daf6e3.js');
26
- require('../VerificationStatusIcon-6fe95a92.js');
26
+ require('../VerificationStatusIcon-d5bfb67a.js');
27
27
  require('../Checkbox-68dc38a8.js');
28
28
  require('nanoid');
29
29
  require('../TextInput-0d109708.js');
@@ -36,17 +36,18 @@ require('../warning-circle-24522402.js');
36
36
  require('../ActionButton-46735b89.js');
37
37
  require('../Button-49f82b31.js');
38
38
  require('../expand-more-94585605.js');
39
- require('../CompactAutocompleteSelect-b68618b3.js');
39
+ require('../CompactAutocompleteSelect-96137f48.js');
40
40
  require('react-select');
41
41
  require('react-select-async-paginate');
42
42
  require('../react-select-creatable.esm-2f23d6c6.js');
43
43
  require('react-dom');
44
- require('../CompactStarRating-405e4508.js');
45
- require('../CompactTextInput-0d53acdf.js');
44
+ require('../CompactStarRating-15c1b812.js');
45
+ require('../CompactTextInput-198d0800.js');
46
46
  require('../MultiSelect-efd60232.js');
47
47
  require('../Radio-32d0513a.js');
48
- require('../TextArea-1da16eb4.js');
48
+ require('../TextArea-18fbcc9f.js');
49
49
  require('../Switch-4a41585f.js');
50
+ require('../AsyncSelect-05ae73fb.js');
50
51
  require('../ContextMenuItem-ba2b697e.js');
51
52
 
52
53