@ntbjs/react-components 2.0.0-rc.26 → 2.0.0-rc.28

package/build/widgets/index.js

@@ -1,65 +1,50 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var AssetAction = require('../AssetAction-d081e4b7.js');
-var ContextMenu = require('../ContextMenu-82f9d728.js');
-var AssetPreviewTopBar = require('../AssetPreviewTopBar-623cfa18.js');
-var Instructions = require('../Instructions-af191987.js');
-var ProgressBar = require('../ProgressBar-2d26c1fb.js');
-var InfoCard = require('../InfoCard-d0fdf377.js');
-require('../_rollupPluginBabelHelpers-4b342fad.js');
-require('lodash');
-require('../defaultTheme-d9a7342e.js');
-require('styled-components');
-require('react');
-require('@restart/hooks/useMergedRefs');
-require('resize-observer-polyfill');
-require('../MultiLevelCheckboxSelect-d229cf98.js');
-require('../Alert-8a511bdc.js');
-require('../Badge-aa4cd9c1.js');
-require('../Popover-c4be47ea.js');
-require('polished');
-require('@tippyjs/react');
-require('../shift-away-subtle-158617af.js');
-require('popper-max-size-modifier');
-require('../Tab-ccbca1f2.js');
-require('../Tabs-b06c0e24.js');
-require('../Tooltip-d5882b82.js');
-require('../VerificationStatusIcon-9876b68f.js');
-require('../Checkbox-0b8faf49.js');
-require('nanoid');
-require('../TextInput-3a567daa.js');
-require('../edit-note-cefe2215.js');
-require('../InputGroup-8d4a4644.js');
-require('../SectionSeparator-e06c7660.js');
-require('../close-1751121a.js');
-require('@restart/hooks/useUpdateEffect');
-require('@floating-ui/react');
-require('../ActionButton-03dc5f67.js');
-require('../Button-2e26f5da.js');
-require('../expand-more-d74e2bd2.js');
-require('../CompactAutocompleteSelect-797778cb.js');
-require('react-select');
-require('react-select-async-paginate');
-require('react-select/creatable');
-require('../CompactStarRating-da21b53f.js');
-require('../CompactTextInput-d56aec71.js');
-require('../MultiSelect-d7920eb1.js');
-require('../Radio-150fb2c9.js');
-require('../TextArea-26d3c8a1.js');
-require('../Switch-d2d6e9ec.js');
-require('../ContextMenuItem-3967010d.js');
-require('../arrow-forward-d7c77ae3.js');
-
-
-
-exports.AssetAction = AssetAction.AssetAction;
-exports.AssetActionBase = AssetAction.AssetActionsBase;
-exports.AssetGallery = AssetAction.AssetGallery;
-exports.SummaryCard = AssetAction.SummaryCard;
-exports.ContextMenu = ContextMenu.ContextMenu;
-exports.AssetPreviewTopBar = AssetPreviewTopBar.AssetPreviewTopBar;
-exports.Instructions = Instructions.Instructions;
-exports.ProgressBar = ProgressBar.ProgressBar;
-exports.InfoCard = InfoCard.InfoCard;
+export { b as AssetAction, a as AssetActionBase, A as AssetGallery, S as SummaryCard } from '../AssetGallery-f67393d4.js';
+export { default as ContextMenu } from './ContextMenu/ContextMenu.js';
+export { default as AssetPreviewTopBar } from './AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.js';
+export { default as Instructions } from './Instructions/Instructions.js';
+export { default as ProgressBar } from './ProgressBar/ProgressBar.js';
+export { default as InfoCard } from './InfoCard/InfoCard.js';
+import '../_rollupPluginBabelHelpers-c245b26a.js';
+import 'lodash';
+import '../defaultTheme-1bcc2541.js';
+import 'styled-components';
+import 'react';
+import '@restart/hooks/useMergedRefs';
+import 'resize-observer-polyfill';
+import '../MultiLevelCheckboxSelect-d8044c88.js';
+import '../Alert-e6847a22.js';
+import '../Badge-d93586a9.js';
+import '../Popover-20050b91.js';
+import 'polished';
+import '@tippyjs/react';
+import '../shift-away-subtle-0dd94a03.js';
+import 'popper-max-size-modifier';
+import '../Tab-04d435c3.js';
+import '../Tabs-74d1ea8a.js';
+import '../Tooltip-c1d1199e.js';
+import '../VerificationStatusIcon-49cb1c1b.js';
+import '../Checkbox-4a5fd716.js';
+import 'nanoid';
+import '../TextInput-fab35842.js';
+import '../edit-note-283a0e15.js';
+import '../InputGroup-1294d190.js';
+import '../SectionSeparator-f47760a2.js';
+import '../close-a5d37608.js';
+import '@restart/hooks/useUpdateEffect';
+import '../warning-circle-24f3efcd.js';
+import '@floating-ui/react';
+import '../ActionButton-4db754c3.js';
+import '../Button-179a2fe4.js';
+import '../expand-more-c5523c46.js';
+import '../CompactAutocompleteSelect-52c49513.js';
+import 'react-select';
+import 'react-select-async-paginate';
+import 'react-select/creatable';
+import '../CompactStarRating-9af2f427.js';
+import '../CompactTextInput-42ca5d42.js';
+import '../MultiSelect-9f497e62.js';
+import '../Radio-73ca3ae2.js';
+import '../TextArea-1e5b9201.js';
+import '../Switch-ecf3122b.js';
+import './ContextMenu/ContextMenuItem/ContextMenuItem.js';
+import '../arrow-forward-ad12c5f3.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "2.0.0-rc.26",
+  "version": "2.0.0-rc.28",
   "publishConfig": {
     "access": "public"
   },
@@ -86,10 +86,10 @@
     "rollup-plugin-delete": "^2.0.0",
     "rollup-plugin-multi-input": "^1.3.1",
     "rollup-plugin-peer-deps-external": "^2.2.0",
-    "rollup-plugin-postcss": "^4.0.0",
+    "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-scss": "^2.6.1",
     "rollup-plugin-url": "^3.0.1",
-    "sass": "^1.34.1",
+    "sass": "^1.97.2",
     "sass-loader": "^10.1.1",
     "storybook-dark-mode": "^2.0.4",
     "url-loader": "^4.1.1"

package/styles/utils/colors.scss

@@ -1,15 +1,15 @@
-@import '../config';
+@use '../config';
 
 @function color($name) {
-  @if map-has-key($colors, $name) {
-    @return map-get($colors, $name);
+  @if map-has-key(config.$colors, $name) {
+    @return map-get(config.$colors, $name);
   } @else {
     @error "No color with the name `#{$name}`. was found.";
   }
 }
 
 :export {
-  @each $name, $color in $colors {
+  @each $name, $color in config.$colors {
     #{$name}: $color;
   }
 }

package/build/AssetPreviewTopBar-623cfa18.js

@@ -1,152 +0,0 @@
-'use strict';
-
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4b342fad.js');
-var React = require('react');
-var defaultTheme = require('./defaultTheme-d9a7342e.js');
-var styled = require('styled-components');
-var close = require('./close-1751121a.js');
-
-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 _path;
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function SvgArrowBack(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 32 32"
-  }, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
-    fill: "currentColor",
-    d: "M16 32L0 16 16 0l2.1 2.1L5.7 14.5H32v3H5.7l12.4 12.4L16 32z"
-  })));
-}
-
-const AssetPreviewTopBar$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  box-sizing: border-box;
-  align-items: center;
-  border-bottom: ${props => props.border ? `1px solid` : `none`};
-  color: inherit;
-  display: flex;
-  font-family: ${props => props.theme.primaryFontFamily};
-  font-weight: 400;
-  min-height: 72px;
-  padding: 0 24px;
-  width: 100%;
-
-  ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-200'))}
-
-  ${props => props.shadow && props.theme.themeProp('box-shadow', '0 -2px 12px #505050', '0 -3px 12px #b0b6b9')}
-
-      ${props => props.disabled && styled.css`
-      cursor: not-allowed;
-    `}
-`;
-const BackButtonContainer = styled__default["default"].a.attrs(defaultTheme.applyDefaultTheme)`
-  align-items: center;
-  display: flex;
-  font-size: 1.125rem;
-  ${props => props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'))};
-
-  ${props => props.disabled && styled.css`
-      opacity: 0.5;
-      pointer-events: none;
-    `}
-
-  &:hover {
-    cursor: pointer;
-  }
-
-  > svg {
-    height: 24px;
-    margin-right: 16px;
-    width: 24px;
-  }
-`;
-const BackHoverEffect = styled__default["default"].div`
-  display: inline-flex;
-  align-items: center;
-
-  > svg {
-    height: 24px;
-    margin-right: 16px;
-    width: 24px;
-    transition: transform 0.3s ease-in-out;
-  }
-
-  &:hover > svg {
-    transform: translateX(-2px);
-  }
-`;
-const LeftText = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)`
-  font-size: 1.125rem;
-  margin-left: 16px;
-
-  ${props => props.theme.themeProp('color', props.theme.getColor('gray-500'), props.theme.getColor('gray-400'))};
-`;
-const ButtonsContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  align-items: center;
-  display: flex;
-  margin-left: auto;
-
-  > span {
-    margin-left: 16px;
-  }
-`;
-
-const AssetPreviewTopBar = React__default["default"].forwardRef(function AssetPreviewTopBar({
-  onBackButtonClick,
-  backButtonText,
-  backButtonAsClose,
-  leftText,
-  buttons,
-  shadow,
-  border,
-  disabled,
-  ...props
-}, forwardedRef) {
-  return React__default["default"].createElement(AssetPreviewTopBar$1, _rollupPluginBabelHelpers._extends({
-    ref: forwardedRef,
-    shadow: shadow,
-    border: border,
-    disabled: disabled
-  }, props), React__default["default"].createElement(BackButtonContainer, {
-    onClick: onBackButtonClick,
-    disabled: disabled
-  }, backButtonAsClose ? React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(close.SvgClose, null), backButtonText) : React__default["default"].createElement(BackHoverEffect, null, React__default["default"].createElement(SvgArrowBack, null), backButtonText)), leftText && React__default["default"].createElement(LeftText, null, leftText), Array.isArray(buttons) && React__default["default"].createElement(ButtonsContainer, null, buttons.map((button, index) => React__default["default"].createElement("span", {
-    key: 'topBarButton-' + index
-  }, button))));
-});
-AssetPreviewTopBar.propTypes = process.env.NODE_ENV !== "production" ? {
-  onBackButtonClick: defaultTheme.PropTypes.func.isRequired,
-  backButtonText: defaultTheme.PropTypes.string.isRequired,
-  disabled: defaultTheme.PropTypes.bool,
-  backButtonAsClose: defaultTheme.PropTypes.bool,
-  leftText: defaultTheme.PropTypes.string,
-  shadow: defaultTheme.PropTypes.bool,
-  border: defaultTheme.PropTypes.bool,
-  buttons: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.node)
-} : {};
-AssetPreviewTopBar.defaultProps = {};
-
-exports.AssetPreviewTopBar = AssetPreviewTopBar;

package/build/ContextMenu-82f9d728.js

@@ -1,33 +0,0 @@
-'use strict';
-
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4b342fad.js');
-var React = require('react');
-var defaultTheme = require('./defaultTheme-d9a7342e.js');
-var styled = require('styled-components');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-const ContextMenu$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  font-family: ${props => props.theme.primaryFontFamily};
-  padding: 3px 0;
-`;
-
-const ContextMenu = React__default["default"].forwardRef(function ContextMenu({
-  children,
-  ...props
-}, forwardedRef) {
-  return React__default["default"].createElement(ContextMenu$1, _rollupPluginBabelHelpers._extends({
-    ref: forwardedRef
-  }, props, {
-    role: "menu"
-  }), children);
-});
-ContextMenu.propTypes = process.env.NODE_ENV !== "production" ? {
-  children: defaultTheme.PropTypes.any
-} : {};
-ContextMenu.defaultProps = {};
-
-exports.ContextMenu = ContextMenu;

package/build/InputGroup-8d4a4644.js

@@ -1,30 +0,0 @@
-'use strict';
-
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4b342fad.js');
-var React = require('react');
-var defaultTheme = require('./defaultTheme-d9a7342e.js');
-var styled = require('styled-components');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-const InputGroup$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  margin: 8px 0;
-`;
-
-const InputGroup = React__default["default"].forwardRef(function InputGroup({
-  children,
-  ...props
-}, forwardedRef) {
-  return React__default["default"].createElement(InputGroup$1, _rollupPluginBabelHelpers._extends({
-    ref: forwardedRef
-  }, props), children);
-});
-InputGroup.propTypes = process.env.NODE_ENV !== "production" ? {
-  children: defaultTheme.PropTypes.node
-} : {};
-InputGroup.defaultProps = {};
-
-exports.InputGroup = InputGroup;

package/build/Instructions-af191987.js

@@ -1,274 +0,0 @@
-'use strict';
-
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4b342fad.js');
-var lodash = require('lodash');
-var defaultTheme = require('./defaultTheme-d9a7342e.js');
-var React = require('react');
-var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-797778cb.js');
-var TextArea = require('./TextArea-26d3c8a1.js');
-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 _path;
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function SvgWarningCircle(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 24 24"
-  }, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
-    fill: "currentColor",
-    d: "M10.8 15.6h2.4V18h-2.4zm0-9.6h2.4v7.2h-2.4zm1.188-6A12 12 0 1024 12 11.994 11.994 0 0011.988 0zM12 21.6a9.6 9.6 0 119.6-9.6 9.597 9.597 0 01-9.6 9.6z"
-  })));
-}
-
-const Instructions$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  display: flex;
-  position: relative;
-  flex-direction: column;
-  ${props => props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};
-`;
-const TopBarContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  position: absolute;
-  display: flex;
-  width: 100%;
-  margin-top: 0;
-  transition: margin-top 120ms;
-  &&.slide-in {
-    margin-top: -24px;
-  }
-  ${props => props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};
-
-  ${props => props.initialHover && props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};
-`;
-const SelectContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  width: 100%;
-  margin: 0 2px;
-`;
-const InstructionsArea = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
-  margin: 2px 2px -2px 2px;
-`;
-
-const Instructions = React__default["default"].forwardRef(function Instructions({
-  clickToAdd,
-  customAddMessage,
-  selectedOption,
-  loadOptions,
-  readOnly,
-  disabled,
-  hidden,
-  name,
-  lightBackground,
-  autoSelect,
-  subscribeCurrentValue: subscribeCurrentValueProp,
-  onChange: onChangeProp,
-  onFocus: onFocusProp,
-  onBlur: onBlurProp,
-  onUpdateCallback,
-  availableOptions,
-  loadingMessageFunc,
-  placeholder,
-  type,
-  selectType,
-  edit,
-  rows,
-  showMore,
-  showMoreText,
-  showLessText,
-  isExpanded,
-  loadingIcon,
-  successIcon,
-  padding,
-  ...props
-}, forwardedRef) {
-  const [isHovered, setIsHovered] = React.useState(false);
-  const [selected, setSelected] = React.useState({});
-  const [addInstructions, setAddInstructions] = React.useState(clickToAdd);
-  const [customMessage, setCustomMessage] = React.useState(customAddMessage);
-  const [background, setBackground] = React.useState(lightBackground);
-  const [initialHover, setInitialHover] = React.useState(true);
-  const [currentValue, setCurrentValue] = React.useState();
-  React.useEffect(() => {
-    if (lodash.isFunction(subscribeCurrentValueProp)) {
-      subscribeCurrentValueProp(currentValue);
-    }
-  }, [currentValue]);
-  React.useEffect(() => {
-    handleChange(selected);
-  }, [selected]);
-  React.useEffect(() => {
-    if (selectedOption) {
-      setCurrentValue(selectedOption.value);
-    }
-  }, [selectedOption]);
-  React.useEffect(() => {
-    if (addInstructions) {
-      setCurrentValue(customMessage);
-      setInitialHover(true);
-    }
-  }, [addInstructions, handleOnFocus]);
-  const onChange = React.useCallback(event => {
-    setCurrentValue(event.target.value);
-    if (lodash.isFunction(onChangeProp)) {
-      onChangeProp(event);
-    }
-  }, [onChangeProp]);
-  const onFocus = React.useCallback(event => {
-    if (autoSelect) {
-      event.target.select();
-    }
-    if (lodash.isFunction(onFocusProp)) {
-      onFocusProp(event);
-    }
-    if (event.target.value === customMessage) {
-      setCurrentValue('');
-    }
-  }, [autoSelect, readOnly, onFocusProp]);
-  const onBlur = React.useCallback(event => {
-    if (lodash.isFunction(onBlurProp)) {
-      onBlurProp(event);
-    }
-  }, [onBlurProp]);
-  const handleMouseOver = () => {
-    setIsHovered(true);
-  };
-  const handleMouseLeave = () => {
-    setIsHovered(false);
-  };
-  const handleOnFocus = () => {
-    if (customMessage === currentValue) {
-      setCurrentValue('');
-    }
-  };
-  const handleChange = selected => {
-    if (selected === null) {
-      setSelected({});
-      setAddInstructions(true);
-      setBackground(true);
-      setInitialHover(true);
-      setCustomMessage(customAddMessage);
-    } else {
-      setSelected(selected);
-      setCurrentValue(selected.value);
-      setAddInstructions(false);
-      setBackground(false);
-      setInitialHover(false);
-      onUpdateCallback(selected);
-    }
-  };
-  const sharedSelectProps = {
-    options: loadOptions ? undefined : availableOptions,
-    loadOptions: loadOptions,
-    loadingMessage: loadingMessageFunc,
-    placeholder: placeholder
-  };
-  if (hidden) return null;
-  return React__default["default"].createElement(Instructions$1, _rollupPluginBabelHelpers._extends({
-    ref: forwardedRef,
-    initialHover: initialHover,
-    onMouseDown: handleMouseOver,
-    onMouseLeave: handleMouseLeave
-  }, props), !readOnly && !disabled && React__default["default"].createElement(TopBarContainer, {
-    initialHover: initialHover,
-    className: isHovered && !readOnly && !disabled && 'slide-in'
-  }, React__default["default"].createElement(SelectContainer, null, React__default["default"].createElement(CompactAutocompleteSelect.CompactAutocompleteSelect, _rollupPluginBabelHelpers._extends({
-    type: selectType,
-    value: selectedOption,
-    creatable: false,
-    onChange: handleChange
-  }, sharedSelectProps)))), React__default["default"].createElement(InstructionsArea, {
-    type: type
-  }, React__default["default"].createElement(TextArea.TextArea, {
-    noBorder: true,
-    instructionsTextArea: true,
-    type: type,
-    lightBackground: background,
-    readOnly: readOnly,
-    disabled: disabled,
-    name: name,
-    isExpanded: isExpanded,
-    edit: edit,
-    value: currentValue === null ? '' : currentValue,
-    onFocus: onFocus,
-    onChange: onChange,
-    onBlur: onBlur,
-    rows: rows,
-    showMore: showMore,
-    showMoreText: showMoreText,
-    showLessText: showLessText,
-    icon: React__default["default"].createElement(SvgWarningCircle, null),
-    loadingIcon: loadingIcon,
-    successIcon: successIcon,
-    padding: padding
-  })));
-});
-Instructions.defaultProps = {
-  clickToAdd: false,
-  lightBackground: false,
-  autoSelect: true,
-  hidden: false,
-  edit: false,
-  disabled: false,
-  readOnly: false,
-  type: '',
-  selectType: '',
-  padding: 'medium',
-  onUpdateCallback: () => {}
-};
-Instructions.propTypes = process.env.NODE_ENV !== "production" ? {
-  name: defaultTheme.PropTypes.string,
-  placeholder: defaultTheme.PropTypes.string,
-  rows: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.number, defaultTheme.PropTypes.string]),
-  selectedOption: defaultTheme.PropTypes.any,
-  loadOptions: defaultTheme.PropTypes.func,
-  loadingMessageFunc: defaultTheme.PropTypes.func,
-  clickToAdd: defaultTheme.PropTypes.bool,
-  customAddMessage: defaultTheme.PropTypes.string,
-  autoSelect: defaultTheme.PropTypes.bool,
-  readOnly: defaultTheme.PropTypes.bool,
-  disabled: defaultTheme.PropTypes.bool,
-  hidden: defaultTheme.PropTypes.bool,
-  showMore: defaultTheme.PropTypes.bool,
-  showMoreText: defaultTheme.PropTypes.string,
-  showLessText: defaultTheme.PropTypes.string,
-  availableOptions: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.object),
-  lightBackground: defaultTheme.PropTypes.bool,
-  edit: defaultTheme.PropTypes.bool,
-  options: defaultTheme.PropTypes.array,
-  subscribeCurrentValue: defaultTheme.PropTypes.func,
-  onChange: defaultTheme.PropTypes.func,
-  onFocus: defaultTheme.PropTypes.func,
-  onBlur: defaultTheme.PropTypes.func,
-  onUpdateCallback: defaultTheme.PropTypes.func,
-  type: defaultTheme.PropTypes.oneOf(['', 'error', 'error-border', 'warning', 'instructions-warning', 'loading', 'success']),
-  selectType: defaultTheme.PropTypes.oneOf(['', 'error', 'warning', 'instructions-warning', 'loading', 'success']),
-  isExpanded: defaultTheme.PropTypes.func,
-  loadingIcon: defaultTheme.PropTypes.element,
-  successIcon: defaultTheme.PropTypes.element,
-  padding: defaultTheme.PropTypes.oneOf(['', 'small', 'medium', 'large'])
-} : {};
-
-exports.Instructions = Instructions;
-exports.SvgWarningCircle = SvgWarningCircle;