@ntbjs/react-components 1.1.2 → 1.2.0-rc.10

package/{MultiSelect-abf02057.js → MultiSelect-4b8d3d0d.js}

@@ -1,12 +1,12 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var nanoid = require('nanoid');
 var styled = require('styled-components');
 var close = require('./close-ebf2f3cf.js');
 var Select = require('react-select');
-var reactSelectCreatable_esm = require('./react-select-creatable.esm-c4ae6839.js');
+var reactSelectCreatable_esm = require('./react-select-creatable.esm-2f23d6c6.js');
 var reactSelectAsyncPaginate = require('react-select-async-paginate');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/{Popover-d3a4b72e.js → Popover-6afb3779.js}

@@ -1,12 +1,12 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var lodash = require('lodash');
 var React = require('react');
 var styled = require('styled-components');
 var polished = require('polished');
 var TippyTooltip = require('@tippyjs/react');
-require('./shift-away-subtle-cfdf1dbe.js');
+require('./shift-away-subtle-0bed9a3c.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/{Radio-70259f02.js → Radio-32d0513a.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var nanoid = require('nanoid');
 var polished = require('polished');

package/{SectionSeparator-225719cd.js → SectionSeparator-259a22ed.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var styled = require('styled-components');
 

package/{Switch-a7cbb0c0.js → Switch-4a41585f.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var nanoid = require('nanoid');
 var polished = require('polished');

package/{Tab-9936ddea.js → Tab-f499ecbc.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var styled = require('styled-components');
 

package/{Tabs-93f6362c.js → Tabs-c2261e7e.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var lodash = require('lodash');
 var React = require('react');
-var Tab = require('./Tab-9936ddea.js');
+var Tab = require('./Tab-f499ecbc.js');
 var styled = require('styled-components');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/{TextArea-a99b3096.js → TextArea-fc4de398.js}

@@ -1,10 +1,9 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
 var nanoid = require('nanoid');
-var check = require('./check-555d831b.js');
 var editNote = require('./edit-note-c47d292e.js');
 var styled = require('styled-components');
 
@@ -22,12 +21,14 @@ var placeholderBaseStyle = styled.css(_templateObject4 || (_templateObject4 = de
 }, function (props) {
   return props.theme.themeProp('opacity', 0.6, 0.5);
 });
-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  svg {\n    width: 15px;\n    opacity: 0.7;\n    transition: opacity 250ms;\n    ", "\n    ", "\n  }\n"])), function (props) {
+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) {
+  return props.theme.themeProp('background-color', props.theme.getColor('gray-900'), props.theme.getColor('gray-300'), '!important');
+}, function (props) {
   return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-900'), '!important');
 }, function (props) {
   return props.disabled && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n        display: none;\n      "])));
 });
-var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n  width: 100%;\n  font-family: inherit;\n  font-size: 0.875rem;\n  border-radius: 2px;\n  padding: 5px 10px;\n  resize: vertical;\n  z-index: 0;\n  border-radius: 3px;\n  box-sizing: border-box;\n  appearance: none;\n  border: 1px solid;\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n\n    transition: height 550ms ease-in-out; border-color 350ms;\n\n  ", "\n\n  ", "\n\n    ", "\n\n  ", "\n  \n    ", "\n \n  ", "\n\n   ", "\n     \n\n  ", "\n  \n\n  ", "\n\n  ", " \n    ", "\n\n    &&:hover:not(:focus) {\n    ", ";\n  }\n\n  ", " \n\n  ", " \n      ", "\n        ", ";\n\n      ", ";\n\n  ", ";\n\n  &&:hover:not(:focus) {\n    ", ";\n    transition: background 350ms;\n    & + ", " {\n      opacity: 1;\n      ", ";\n      transition: opacity 350ms;\n    }\n  }\n\n  ", "\n  ", "\n  ", "\n\n  &::placeholder {\n    ", "\n\n    ", "\n  }\n\n  &&:focus {\n    outline: none;\n    ", "\n\n    ", ";\n\n    ", "\n    ", "\n  }\n\n  &&:not(:hover):not(:focus) {\n    ", ";\n\n    ", ";\n  }\n"])), function (props) {
+var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n  width: 100%;\n  font-family: inherit;\n  font-size: 0.875rem;\n  border-radius: 2px;\n  padding: 5px 10px;\n  resize: vertical;\n  z-index: 0;\n  border-radius: 3px;\n  box-sizing: border-box;\n  appearance: none;\n  border: 1px solid;\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n\n    transition: height 550ms ease-in-out; border-color 350ms;\n\n  ", "\n\n  ", "\n\n    ", "\n\n  ", "\n  \n    ", "\n \n  ", "\n\n   ", "\n     \n\n  ", "\n  \n\n  ", "\n\n  ", " \n    ", "\n\n    &&:hover:not(:focus) {\n    ", ";\n       ", ";\n\n  }\n\n  ", " \n\n  ", " \n      ", "\n        ", ";\n\n      ", ";\n\n  ", ";\n\n  &&:hover:not(:focus) {\n    ", ";\n    transition: background 350ms;\n    & + ", " {\n      opacity: 1;\n      ", ";\n      transition: opacity 350ms;\n    }\n  }\n\n  ", "\n  ", "\n  ", "\n\n  &::placeholder {\n    ", "\n\n    ", "\n  }\n\n  &&:focus {\n    outline: none;\n    ", "\n\n    ", ";\n\n    ", "\n    ", "\n  }\n\n  &&:not(:hover):not(:focus) {\n    ", ";\n\n    ", ";\n  }\n"])), function (props) {
   return props.padding === 'small' && styled.css(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n      padding: 5px 10px;\n    "])));
 }, function (props) {
   return props.padding === 'medium' && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n      padding: 13px 15px;\n    "])));
@@ -60,7 +61,9 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
 }, function (props) {
   return props.type === 'error-border' && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n        ", "\n      "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
 }, function (props) {
-  return !props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
+  return !props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-800'), props.theme.getColor('gray-100'));
+}, function (props) {
+  return props.disabled && props.theme.themeProp('background', props.theme.getColor('gray-900'), 'white');
 }, function (props) {
   return props.type === 'warning' && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n      padding: 13px 15px 13px 10px;\n      ", "\n      ", "\n        &&:hover:not(:focus) {\n        ", "\n        ", "\n      }\n      &&:read-only:hover {\n        ", "\n      }\n    "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01 ', props.theme.getColor('signal-yellow-400')), function (props) {
     return props.disabled && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n            background: none !important;\n          "])));
@@ -136,7 +139,7 @@ var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDe
 }, function (props) {
   return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
 });
-var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject42 || (_templateObject42 = 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\n  ", "\n  transition:  margin-top 550ms ease-in-out;\n  -webkit-mask-image: linear-gradient(180deg, transparent 1px, white 5px);\n  ", "\n\n  ", ";\n\n  ", "\n"])), function (props) {
+var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject42 || (_templateObject42 = defaultTheme._taggedTemplateLiteral(["\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  height: 14px !important;\n  margin-top: -23px;\n\n  ", "\n  transition:  margin-top 550ms ease-in-out;\n  -webkit-mask-image: linear-gradient(180deg, transparent 1px, white 6px);\n  ", "\n\n  ", ";\n\n  ", "\n"])), function (props) {
   return props.expanded && styled.css(_templateObject43 || (_templateObject43 = defaultTheme._taggedTemplateLiteral(["\n      margin-top: 0px;\n    "])));
 }, function (props) {
   return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
@@ -173,7 +176,10 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
       noBorder = _ref.noBorder,
       instructionsTextArea = _ref.instructionsTextArea,
       isExpanded = _ref.isExpanded,
-      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 = _ref.loadingIcon,
+      successIcon = _ref.successIcon,
+      padding = _ref.padding,
+      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"]);
 
   var textInputDomNode = React.useRef(null);
   var textInputRef = useMergedRefs.useMergedRefs(forwardedRef, textInputDomNode);
@@ -208,8 +214,13 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
       uniqueId = _useState12[0];
 
   var handleTextAreaChange = function handleTextAreaChange() {
+    setExpanded(true);
+    isExpanded(true);
+  };
+
+  var handleTextAreaShowLess = function handleTextAreaShowLess() {
     setExpanded(!expanded);
-    isExpanded(expanded);
+    isExpanded(!expanded);
   };
 
   var calculateRows = function calculateRows() {
@@ -240,7 +251,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
     }
   }, []);
   if (hidden) return null;
-  return React__default['default'].createElement(TextInput, {
+  return React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(TextInput, {
     disabled: disabled,
     readOnly: readOnly,
     type: type,
@@ -281,21 +292,20 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
     onBlur: onBlur,
     noBorder: noBorder
   }, rest, {
-    onClick: showMore && handleTextAreaChange
-  })), (type === 'loading' || type === 'success') && React__default['default'].createElement(SuccessContainer, null, type === 'loading' && React__default['default'].createElement(check._default, {
-    color: '#b0b6b9',
-    size: 12
-  }), type === 'success' && React__default['default'].createElement(check.SvgCheck, null)), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
+    onClick: showMore ? handleTextAreaChange : undefined
+  })), (type === 'loading' || type === 'success') && React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && React__default['default'].createElement(InputIconContainer, {
     disabled: disabled
-  }, React__default['default'].createElement(editNote.SvgEditNote, null)), label && React__default['default'].createElement(TextInputLabel, {
+  }, React__default['default'].createElement(editNote.SvgEditNote, {
+    className: padding === 'small' && 'smallPadingIcon'
+  })), label && React__default['default'].createElement(TextInputLabel, {
     htmlFor: "text-input-".concat(uniqueId),
     hasPlaceholder: Boolean(placeholder),
     hasIcon: Boolean(icon),
     inputIsEmpty: inputIsEmpty
   }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
     type: type
-  }, description), maxContentRows > rows && showMore && React__default['default'].createElement(ShowMoreText, {
-    onClick: handleTextAreaChange,
+  }, description)), maxContentRows > rows && showMore && React__default['default'].createElement(ShowMoreText, {
+    onClick: showMore ? handleTextAreaShowLess : undefined,
     expanded: expanded
   }, !expanded ? showMoreText : showLessText));
 });
@@ -342,7 +352,9 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
   noBorder: defaultTheme.PropTypes.bool,
   isExpanded: defaultTheme.PropTypes.func,
   type: defaultTheme.PropTypes.oneOf(['', 'error', 'error-border', 'warning', 'loading', 'success']),
-  instructionsTextArea: defaultTheme.PropTypes.bool
+  instructionsTextArea: defaultTheme.PropTypes.bool,
+  loadingIcon: defaultTheme.PropTypes.element,
+  successIcon: defaultTheme.PropTypes.element
 } : {};
 
 exports.TextArea = TextArea;

package/{TextInput-c0ef017d.js → TextInput-0d109708.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var nanoid = require('nanoid');
 var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');

package/{Tooltip-1b7b0052.js → Tooltip-6b6f0b0a.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var defaultTheme = require('./defaultTheme-50f2b88f.js');
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var styled = require('styled-components');
 var TippyTooltip = require('@tippyjs/react');
-require('./shift-away-subtle-cfdf1dbe.js');
+require('./shift-away-subtle-0bed9a3c.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/VerificationStatusIcon-b574fd21.js

@@ -0,0 +1,106 @@
+'use strict';
+
+var defaultTheme = require('./defaultTheme-ea44e34a.js');
+var React = require('react');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () {
+            return e[k];
+          }
+        });
+      }
+    });
+  }
+  n['default'] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var _templateObject, _templateObject2;
+var VerificationStatusIcon$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  display: flex;\n  position: relative;\n  font: normal normal normal 12px/16px Roboto;\n\n  ", ";\n\n  svg {\n    height: ", "px;\n  }\n"])), function (props) {
+  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-700'));
+}, function (props) {
+  var _props$iconHeight;
+
+  return (_props$iconHeight = props.iconHeight) !== null && _props$iconHeight !== void 0 ? _props$iconHeight : 15;
+});
+var VerificationStatusColor = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n  position: absolute;\n  bottom: 0;\n  left: ", "px;\n  width: ", "px;\n  height: ", "px;\n  border-radius: 50%;\n\n  ", "\n"])), function (props) {
+  var _props$iconHeight2;
+
+  return ((_props$iconHeight2 = props.iconHeight) !== null && _props$iconHeight2 !== void 0 ? _props$iconHeight2 : 15) * 2 / 3;
+}, function (props) {
+  var _props$iconHeight3;
+
+  return ((_props$iconHeight3 = props.iconHeight) !== null && _props$iconHeight3 !== void 0 ? _props$iconHeight3 : 15) * 2 / 3;
+}, function (props) {
+  var _props$iconHeight4;
+
+  return ((_props$iconHeight4 = props.iconHeight) !== null && _props$iconHeight4 !== void 0 ? _props$iconHeight4 : 15) * 2 / 3;
+}, function (props) {
+  var darkThemeColor = props.theme.getColor('gray-100');
+  var lightThemeColor = props.theme.getColor('gray-500');
+
+  if (props.status === 'verified') {
+    darkThemeColor = props.theme.getColor('emerald-500');
+    lightThemeColor = props.theme.getColor('emerald-300');
+  } else if (props.status === 'pending') {
+    darkThemeColor = props.theme.getColor('brown-500');
+    lightThemeColor = props.theme.getColor('signal-yellow-500');
+  } else if (props.status === 'rejected') {
+    darkThemeColor = props.theme.getColor('red-600');
+    lightThemeColor = props.theme.getColor('red-200');
+  }
+
+  return props.theme.themeProp('background-color', darkThemeColor, lightThemeColor);
+});
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var _ref = /*#__PURE__*/React__namespace.createElement("path", {
+  fill: "currentColor",
+  d: "M9.3 12.662q-1.698 0-2.864-1.166T5.27 8.632q0-1.697 1.166-2.864T9.3 4.602q1.698 0 2.864 1.166t1.166 2.864q0 1.698-1.166 2.864T9.3 12.662zm0-1.86q.925 0 1.548-.622.622-.622.622-1.548t-.622-1.547q-.623-.623-1.548-.623t-1.548.623q-.622.622-.622 1.547t.622 1.548q.623.622 1.548.622zm0 12.686q-4.023-1.097-6.661-4.735Q0 15.113 0 10.616V3.482L9.3 0l9.3 3.482v7.134q0 4.498-2.639 8.137-2.638 3.639-6.661 4.735zm0-11.744zm0-9.765L1.86 4.757v5.86q0 1.769.507 3.421.507 1.653 1.408 3.083 1.254-.639 2.626-.999 1.373-.36 2.899-.36t2.898.36q1.373.36 2.627 1 .901-1.431 1.408-3.084.507-1.652.507-3.422V4.757L9.3 1.98zm0 15.643q-1.2 0-2.307.26-1.108.26-2.093.73.923 1.025 2.03 1.773 1.109.747 2.37 1.143 1.262-.395 2.363-1.143 1.102-.748 2.025-1.773-.985-.47-2.087-.73-1.102-.26-2.301-.26z"
+});
+
+function SvgVerification(props) {
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "-2.5 0 24 24"
+  }, props), _ref);
+}
+
+var VerificationStatusIcon = React__default['default'].forwardRef(function VerificationStatusIcon(_ref, forwardedRef) {
+  var status = _ref.status,
+      iconHeight = _ref.iconHeight,
+      props = defaultTheme._objectWithoutProperties(_ref, ["status", "iconHeight"]);
+
+  return React__default['default'].createElement(VerificationStatusIcon$1, defaultTheme._extends({
+    iconHeight: iconHeight,
+    ref: forwardedRef
+  }, props), React__default['default'].createElement(SvgVerification, null), React__default['default'].createElement(VerificationStatusColor, {
+    iconHeight: iconHeight,
+    status: status
+  }));
+});
+VerificationStatusIcon.propTypes = process.env.NODE_ENV !== "production" ? {
+  status: defaultTheme.PropTypes.oneOf(['verified', 'pending', 'rejected']).isRequired,
+  iconHeight: defaultTheme.PropTypes.number
+} : {};
+VerificationStatusIcon.defaultProps = {
+  iconHeight: 15
+};
+
+exports.VerificationStatusIcon = VerificationStatusIcon;

package/data/Alert/index.js

@@ -1,9 +1,10 @@
 'use strict';
 
-var Alert = require('../../Alert-3e4f8be1.js');
-require('../../defaultTheme-50f2b88f.js');
+var Alert = require('../../Alert-13b75102.js');
+require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');
+require('lodash');
 
 
 

package/data/Badge/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var Badge = require('../../Badge-9461fc7f.js');
-require('../../defaultTheme-50f2b88f.js');
+var Badge = require('../../Badge-aec841c8.js');
+require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');
 

package/data/Popover/index.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var Popover = require('../../Popover-d3a4b72e.js');
-require('../../defaultTheme-50f2b88f.js');
+var Popover = require('../../Popover-6afb3779.js');
+require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
 require('react');
 require('polished');
 require('@tippyjs/react');
-require('../../shift-away-subtle-cfdf1dbe.js');
+require('../../shift-away-subtle-0bed9a3c.js');
 
 
 

package/data/Tab/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var Tab = require('../../Tab-9936ddea.js');
-require('../../defaultTheme-50f2b88f.js');
+var Tab = require('../../Tab-f499ecbc.js');
+require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');
 

package/data/Tabs/index.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var Tabs = require('../../Tabs-93f6362c.js');
-require('../../defaultTheme-50f2b88f.js');
+var Tabs = require('../../Tabs-c2261e7e.js');
+require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
 require('react');
-require('../../Tab-9936ddea.js');
+require('../../Tab-f499ecbc.js');
 
 
 

package/data/Tooltip/index.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var Tooltip = require('../../Tooltip-1b7b0052.js');
-require('../../defaultTheme-50f2b88f.js');
+var Tooltip = require('../../Tooltip-6b6f0b0a.js');
+require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');
 require('@tippyjs/react');
-require('../../shift-away-subtle-cfdf1dbe.js');
+require('../../shift-away-subtle-0bed9a3c.js');
 
 
 

package/data/index.js

@@ -2,19 +2,20 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Alert = require('../Alert-3e4f8be1.js');
-var Badge = require('../Badge-9461fc7f.js');
-var Popover = require('../Popover-d3a4b72e.js');
-var Tab = require('../Tab-9936ddea.js');
-var Tabs = require('../Tabs-93f6362c.js');
-var Tooltip = require('../Tooltip-1b7b0052.js');
-require('../defaultTheme-50f2b88f.js');
+var Alert = require('../Alert-13b75102.js');
+var Badge = require('../Badge-aec841c8.js');
+var Popover = require('../Popover-6afb3779.js');
+var Tab = require('../Tab-f499ecbc.js');
+var Tabs = require('../Tabs-c2261e7e.js');
+var Tooltip = require('../Tooltip-6b6f0b0a.js');
+var VerificationStatusIcon = require('../VerificationStatusIcon-b574fd21.js');
+require('../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');
 require('lodash');
 require('polished');
 require('@tippyjs/react');
-require('../shift-away-subtle-cfdf1dbe.js');
+require('../shift-away-subtle-0bed9a3c.js');
 
 
 
@@ -24,3 +25,4 @@ exports.Popover = Popover.Popover;
 exports.Tab = Tab.Tab;
 exports.Tabs = Tabs.Tabs;
 exports.Tooltip = Tooltip.Tooltip;
+exports.VerificationStatusIcon = VerificationStatusIcon.VerificationStatusIcon;

package/{defaultTheme-50f2b88f.js → defaultTheme-ea44e34a.js}

@@ -212,6 +212,63 @@ function _nonIterableRest() {
   throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
 
+function _createForOfIteratorHelper(o, allowArrayLike) {
+  var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
+
+  if (!it) {
+    if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
+      if (it) o = it;
+      var i = 0;
+
+      var F = function () {};
+
+      return {
+        s: F,
+        n: function () {
+          if (i >= o.length) return {
+            done: true
+          };
+          return {
+            done: false,
+            value: o[i++]
+          };
+        },
+        e: function (e) {
+          throw e;
+        },
+        f: F
+      };
+    }
+
+    throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  }
+
+  var normalCompletion = true,
+      didErr = false,
+      err;
+  return {
+    s: function () {
+      it = it.call(o);
+    },
+    n: function () {
+      var step = it.next();
+      normalCompletion = step.done;
+      return step;
+    },
+    e: function (e) {
+      didErr = true;
+      err = e;
+    },
+    f: function () {
+      try {
+        if (!normalCompletion && it.return != null) it.return();
+      } finally {
+        if (didErr) throw err;
+      }
+    }
+  };
+}
+
 var propTypes = {exports: {}};
 
 var reactIs = {exports: {}};
@@ -1322,7 +1379,7 @@ function styleInject(css, ref) {
 }
 
 var css_248z = "/**\n * Colors\n */\n";
-var importedColors = {"orange-500":"#ff9900","orange-400":"#ffcb7e","emerald-500":"#30826a","emerald-400":"#64b49d","emerald-300":"#bfe0d5","emerald-200":"#f3f9f7","gray-900":"#141313","gray-800":"#272727","gray-700":"#323232","gray-600":"#505050","gray-500":"#767676","gray-400":"#b0b6b9","gray-300":"#d9dce0","gray-200":"#eff1f4","gray-100":"#f7f8f9","cercise-500":"#5f1031","cercise-400":"#854962","cercise-300":"#d099b0","cercise-100":"#f9f3f5","red-500":"#d83000","red-200":"#fbeae6","signal-yellow-500":"#f4e21e","signal-yellow-400":"#fff36c","signal-green-500":"#00bd98","signal-green-400":"#a3ffe0","black":"#000000","white":"#ffffff"};
+var importedColors = {"orange-500":"#ff9900","orange-400":"#ffcb7e","emerald-500":"#30826a","emerald-400":"#64b49d","emerald-300":"#bfe0d5","emerald-200":"#f3f9f7","gray-900":"#141313","gray-800":"#272727","gray-700":"#323232","gray-600":"#505050","gray-500":"#767676","gray-400":"#b0b6b9","gray-300":"#d9dce0","gray-200":"#eff1f4","gray-100":"#f7f8f9","cercise-500":"#5f1031","cercise-400":"#854962","cercise-300":"#d099b0","cercise-100":"#f9f3f5","red-600":"#7f1b1b","red-500":"#d83000","red-200":"#fbeae6","brown-500":"#634e01","signal-yellow-500":"#f4e21e","signal-yellow-400":"#fff36c","signal-green-500":"#00bd98","signal-green-400":"#a3ffe0","black":"#202435","white":"#ffffff"};
 styleInject(css_248z);
 
 var _templateObject;
@@ -1353,6 +1410,7 @@ function applyDefaultTheme(_ref) {
 }
 
 exports.PropTypes = PropTypes;
+exports._createForOfIteratorHelper = _createForOfIteratorHelper;
 exports._extends = _extends;
 exports._objectSpread2 = _objectSpread2;
 exports._objectWithoutProperties = _objectWithoutProperties;

package/icons/add.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+	<path fill="currentColor" d="M 10.58 13.3399 h -10.58 v -2.7599 h 10.58 v -10.58 h 2.7599 v 10.58 h 10.58 v 2.7599 h -10.58 v 10.58 h -2.7599 v -10.58 Z"/>
+</svg>

package/icons/album.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+  <path fill="currentColor" d="M21.6,2.4V16.8H7.2V2.4H21.6m0-2.4H7.2A2.4071,2.4071,0,0,0,4.8,2.4V16.8a2.4071,2.4071,0,0,0,2.4,2.4H21.6A2.4071,2.4071,0,0,0,24,16.8V2.4A2.4071,2.4071,0,0,0,21.6,0ZM11.4,11.604l2.028,2.712,2.976-3.72L20.4,15.6H8.4ZM0,4.8V21.6A2.4071,2.4071,0,0,0,2.4,24H19.2V21.6H2.4V4.8Z"/>
+</svg>

package/icons/check-rectangle-filled.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+	<path fill="currentColor" d="m 10.146 17.622 l 9.4117 -9.4117 l -1.869 -1.869 l -7.5427 7.5427 l -3.8048 -3.8048 l -1.869 1.869 l 5.6738 5.6738 Z M 2.67 24.03 q -1.1014 0 -1.8856 -0.7843 T 0 21.36 v -18.69 q 0 -1.1014 0.7843 -1.8856 T 2.67 0 h 18.69 q 1.1014 0 1.8856 0.7843 T 24.03 2.67 v 18.69 q 0 1.1014 -0.7843 1.8856 T 21.36 24.03 H 2.67 Z"/>
+</svg>

package/icons/corporate.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-0.5 -1.5 24 24">
+	<path fill="currentColor" d="M 0 20.7 v -20.7 h 11.5 v 4.6 h 11.5 v 16.1 H 0 Z m 2.3 -2.3 h 6.9 v -2.3 H 2.3 v 2.3 Z m 0 -4.6 h 6.9 v -2.3 H 2.3 v 2.3 Z m 0 -4.6 h 6.9 v -2.3 H 2.3 v 2.3 Z m 0 -4.6 h 6.9 v -2.3 H 2.3 v 2.3 Z m 9.2 13.8 h 9.2 v -11.5 H 11.5 v 11.5 Z m 2.3 -6.9 v -2.3 h 4.6 v 2.3 H 13.8 Z m 0 4.6 v -2.3 h 4.6 v 2.3 H 13.8 Z"/>
+</svg>

package/icons/download.svg

@@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21.3333 24">
-  <path fill="currentColor" d="M16,13.3333H12V0H9.3333V13.3333h-4l5.3334,5.3334Zm-16,8V24H21.3333V21.3333Z"/>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+	<path fill="currentColor" d="M 12 18.0615 L 5.1693 11.2308 l 1.6861 -1.7354 l 3.9446 3.9446 v -13.44 h 2.3999 v 13.44 l 3.9446 -3.9446 l 1.6861 1.7354 L 12 18.0615 Z M 2.8923 23.9999 q -1.2123 0 -2.0523 -0.84 t -0.84 -2.0523 v -4.3384 H 2.4 v 4.3384 q 0 0.1846 0.1538 0.3385 q 0.1539 0.1538 0.3385 0.1538 h 18.2153 q 0.1846 0 0.3385 -0.1538 q 0.1538 -0.1539 0.1538 -0.3385 v -4.3384 h 2.4 v 4.3384 q 0 1.2123 -0.84 2.0523 t -2.0523 0.84 H 2.8923 Z"/>
+</svg>