@ndla/ui 27.1.0 → 27.1.2

package/es/MyNdla/Resource/FolderInput.js

@@ -1,102 +1,90 @@
 import _styled from "@emotion/styled-base";
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+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); }
 
-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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-import { IconButton } from '@ndla/button';
-import { FolderOutlined } from '@ndla/icons/contentType';
+import { IconButton, IconButtonV2 } from '@ndla/button';
 import { Cross } from '@ndla/icons/action';
-import React, { useRef, useState } from 'react';
+import React, { forwardRef, useEffect } from 'react';
+import { isMobile } from 'react-device-detect';
 import { useTranslation } from 'react-i18next';
 import { colors, spacing } from '@ndla/core';
-import { Input } from '@ndla/forms';
-import { css } from '@emotion/core';
-import { Done } from '@ndla/icons/editor'; // Source: https://kovart.github.io/dashed-border-generator/
-
+import { InputV2 } from '@ndla/forms';
+import { Done } from '@ndla/icons/editor';
+import { Spinner } from '@ndla/icons';
+import { useForwardedRef } from '@ndla/util';
 import { jsx as ___EmotionJSX } from "@emotion/core";
-var borderStyle = "url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='".concat(encodeURIComponent(colors.brand.tertiary), "' stroke-width='2' stroke-dasharray='8%2c8' stroke-dashoffset='4' stroke-linecap='square'/%3e%3c/svg%3e\")");
-
-var StyledFolderIcon = _styled("span", {
-  target: "esbqk1r0",
-  label: "StyledFolderIcon"
-})("display:flex;padding:", spacing.small, ";svg{color:", colors.brand.primary, ";height:20px;width:20px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlcklucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3Qm9DIiwiZmlsZSI6IkZvbGRlcklucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiB9IGZyb20gJ0BuZGxhL2J1dHRvbic7XG5pbXBvcnQgeyBGb2xkZXJPdXRsaW5lZCB9IGZyb20gJ0BuZGxhL2ljb25zL2NvbnRlbnRUeXBlJztcbmltcG9ydCB7IENyb3NzIH0gZnJvbSAnQG5kbGEvaWNvbnMvYWN0aW9uJztcbmltcG9ydCBSZWFjdCwgeyBDaGFuZ2VFdmVudCwgS2V5Ym9hcmRFdmVudCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IElucHV0IH0gZnJvbSAnQG5kbGEvZm9ybXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XG5pbXBvcnQgeyBEb25lIH0gZnJvbSAnQG5kbGEvaWNvbnMvZWRpdG9yJztcblxuLy8gU291cmNlOiBodHRwczovL2tvdmFydC5naXRodWIuaW8vZGFzaGVkLWJvcmRlci1nZW5lcmF0b3IvXG5jb25zdCBib3JkZXJTdHlsZSA9IGB1cmwoXCJkYXRhOmltYWdlL3N2Zyt4bWwsJTNjc3ZnIHdpZHRoPScxMDAlMjUnIGhlaWdodD0nMTAwJTI1JyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnJTNlJTNjcmVjdCB3aWR0aD0nMTAwJTI1JyBoZWlnaHQ9JzEwMCUyNScgZmlsbD0nbm9uZScgc3Ryb2tlPScke2VuY29kZVVSSUNvbXBvbmVudChcbiAgY29sb3JzLmJyYW5kLnRlcnRpYXJ5LFxuKX0nIHN0cm9rZS13aWR0aD0nMicgc3Ryb2tlLWRhc2hhcnJheT0nOCUyYzgnIHN0cm9rZS1kYXNob2Zmc2V0PSc0JyBzdHJva2UtbGluZWNhcD0nc3F1YXJlJy8lM2UlM2Mvc3ZnJTNlXCIpYDtcblxuY29uc3QgU3R5bGVkRm9sZGVySWNvbiA9IHN0eWxlZC5zcGFuYFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBzdmcge1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgICBoZWlnaHQ6IDIwcHg7XG4gICAgd2lkdGg6IDIwcHg7XG4gIH1cbmA7XG5cbmNvbnN0IGlucHV0V3JhcHBlclN0eWxlID0gY3NzYFxuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBiYWNrZ3JvdW5kOiBub25lO1xuICBiYWNrZ3JvdW5kLWltYWdlOiAke2JvcmRlclN0eWxlfTtcbiAgYm9yZGVyOiBub25lO1xuYDtcblxuY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoSW5wdXQpYFxuICAmJiB7XG4gICAgZmxleC1ncm93OiAxO1xuICAgIGZsZXgtYmFzaXM6IDA7XG4gICAgbWluLXdpZHRoOiAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxLjc1ZW07XG4gICAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuICAgIDo6c2VsZWN0aW9uIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7Y29sb3JzLmJyYW5kLmxpZ2h0ZXJ9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgUm93ID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiAke3NwYWNpbmcueHNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLnNtYWxsfTtcbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIG9uQWRkRm9sZGVyOiAobmFtZTogc3RyaW5nKSA9PiB2b2lkO1xuICBvbkNsb3NlOiAoKSA9PiB2b2lkO1xuICBhdXRvU2VsZWN0PzogYm9vbGVhbjtcbn1cblxuY29uc3QgRm9sZGVySW5wdXQgPSAoeyBvbkFkZEZvbGRlciwgb25DbG9zZSwgYXV0b1NlbGVjdCB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IG5ld0ZvbGRlclRleHQgPSB0KCd0cmVlU3RydWN0dXJlLm5ld0ZvbGRlci5kZWZhdWx0TmFtZScpO1xuICBjb25zdCBbaW5wdXQsIHNldElucHV0XSA9IHVzZVN0YXRlPHN0cmluZz4obmV3Rm9sZGVyVGV4dCk7XG4gIGNvbnN0IGlucHV0UmVmID0gdXNlUmVmPEhUTUxJbnB1dEVsZW1lbnQ+KG51bGwpO1xuXG4gIGNvbnN0IGhhbmRsZUlucHV0Q2hhbmdlID0gKGU6IENoYW5nZUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgc2V0SW5wdXQoZS50YXJnZXQudmFsdWUpO1xuICB9O1xuXG4gIGNvbnN0IG9uS2V5ZG93biA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIGlucHV0LnRyaW0oKSkge1xuICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgb25BZGRGb2xkZXIoaW5wdXQpO1xuICAgIH0gZWxzZSBpZiAoZS5rZXkgPT09ICdFc2NhcGUnKSB7XG4gICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICBvbkNsb3NlKCk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZElucHV0XG4gICAgICBhdXRvU2VsZWN0PXthdXRvU2VsZWN0fVxuICAgICAgY3VzdG9tQ3NzPXtpbnB1dFdyYXBwZXJTdHlsZX1cbiAgICAgIHdhcm5pbmdUZXh0PXshaW5wdXQudHJpbSgpID8gdCgnbXlOZGxhLmZvbGRlci5taXNzaW5nTmFtZScpIDogdW5kZWZpbmVkfVxuICAgICAgcmVmPXtpbnB1dFJlZn1cbiAgICAgIHZhbHVlPXtpbnB1dH1cbiAgICAgIG9uQ2hhbmdlPXtoYW5kbGVJbnB1dENoYW5nZX1cbiAgICAgIG9uS2V5RG93bj17b25LZXlkb3dufVxuICAgICAgYXJpYS1sYWJlbD17bmV3Rm9sZGVyVGV4dH1cbiAgICAgIGljb25MZWZ0PXtcbiAgICAgICAgPFN0eWxlZEZvbGRlckljb24+XG4gICAgICAgICAgPEZvbGRlck91dGxpbmVkIC8+XG4gICAgICAgIDwvU3R5bGVkRm9sZGVySWNvbj5cbiAgICAgIH1cbiAgICAgIGljb25SaWdodD17XG4gICAgICAgIDxSb3c+XG4gICAgICAgICAgPEljb25CdXR0b24gYXJpYS1sYWJlbD17dCgnY2xvc2UnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9e29uQ2xvc2V9PlxuICAgICAgICAgICAgPENyb3NzIC8+XG4gICAgICAgICAgPC9JY29uQnV0dG9uPlxuICAgICAgICAgIDxJY29uQnV0dG9uIGFyaWEtbGFiZWw9e3QoJ3NhdmUnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9eygpID0+IG9uQWRkRm9sZGVyKGlucHV0KX0+XG4gICAgICAgICAgICA8RG9uZSAvPlxuICAgICAgICAgIDwvSWNvbkJ1dHRvbj5cbiAgICAgICAgPC9Sb3c+XG4gICAgICB9XG4gICAgLz5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlcklucHV0O1xuIl19 */"));
 
-var inputWrapperStyle = /*#__PURE__*/css("padding:", spacing.small, ";background:none;background-image:", borderStyle, ";border:none;;label:inputWrapperStyle;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlcklucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQzZCIiwiZmlsZSI6IkZvbGRlcklucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiB9IGZyb20gJ0BuZGxhL2J1dHRvbic7XG5pbXBvcnQgeyBGb2xkZXJPdXRsaW5lZCB9IGZyb20gJ0BuZGxhL2ljb25zL2NvbnRlbnRUeXBlJztcbmltcG9ydCB7IENyb3NzIH0gZnJvbSAnQG5kbGEvaWNvbnMvYWN0aW9uJztcbmltcG9ydCBSZWFjdCwgeyBDaGFuZ2VFdmVudCwgS2V5Ym9hcmRFdmVudCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IElucHV0IH0gZnJvbSAnQG5kbGEvZm9ybXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XG5pbXBvcnQgeyBEb25lIH0gZnJvbSAnQG5kbGEvaWNvbnMvZWRpdG9yJztcblxuLy8gU291cmNlOiBodHRwczovL2tvdmFydC5naXRodWIuaW8vZGFzaGVkLWJvcmRlci1nZW5lcmF0b3IvXG5jb25zdCBib3JkZXJTdHlsZSA9IGB1cmwoXCJkYXRhOmltYWdlL3N2Zyt4bWwsJTNjc3ZnIHdpZHRoPScxMDAlMjUnIGhlaWdodD0nMTAwJTI1JyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnJTNlJTNjcmVjdCB3aWR0aD0nMTAwJTI1JyBoZWlnaHQ9JzEwMCUyNScgZmlsbD0nbm9uZScgc3Ryb2tlPScke2VuY29kZVVSSUNvbXBvbmVudChcbiAgY29sb3JzLmJyYW5kLnRlcnRpYXJ5LFxuKX0nIHN0cm9rZS13aWR0aD0nMicgc3Ryb2tlLWRhc2hhcnJheT0nOCUyYzgnIHN0cm9rZS1kYXNob2Zmc2V0PSc0JyBzdHJva2UtbGluZWNhcD0nc3F1YXJlJy8lM2UlM2Mvc3ZnJTNlXCIpYDtcblxuY29uc3QgU3R5bGVkRm9sZGVySWNvbiA9IHN0eWxlZC5zcGFuYFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBzdmcge1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgICBoZWlnaHQ6IDIwcHg7XG4gICAgd2lkdGg6IDIwcHg7XG4gIH1cbmA7XG5cbmNvbnN0IGlucHV0V3JhcHBlclN0eWxlID0gY3NzYFxuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBiYWNrZ3JvdW5kOiBub25lO1xuICBiYWNrZ3JvdW5kLWltYWdlOiAke2JvcmRlclN0eWxlfTtcbiAgYm9yZGVyOiBub25lO1xuYDtcblxuY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoSW5wdXQpYFxuICAmJiB7XG4gICAgZmxleC1ncm93OiAxO1xuICAgIGZsZXgtYmFzaXM6IDA7XG4gICAgbWluLXdpZHRoOiAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxLjc1ZW07XG4gICAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuICAgIDo6c2VsZWN0aW9uIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7Y29sb3JzLmJyYW5kLmxpZ2h0ZXJ9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgUm93ID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiAke3NwYWNpbmcueHNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLnNtYWxsfTtcbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIG9uQWRkRm9sZGVyOiAobmFtZTogc3RyaW5nKSA9PiB2b2lkO1xuICBvbkNsb3NlOiAoKSA9PiB2b2lkO1xuICBhdXRvU2VsZWN0PzogYm9vbGVhbjtcbn1cblxuY29uc3QgRm9sZGVySW5wdXQgPSAoeyBvbkFkZEZvbGRlciwgb25DbG9zZSwgYXV0b1NlbGVjdCB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IG5ld0ZvbGRlclRleHQgPSB0KCd0cmVlU3RydWN0dXJlLm5ld0ZvbGRlci5kZWZhdWx0TmFtZScpO1xuICBjb25zdCBbaW5wdXQsIHNldElucHV0XSA9IHVzZVN0YXRlPHN0cmluZz4obmV3Rm9sZGVyVGV4dCk7XG4gIGNvbnN0IGlucHV0UmVmID0gdXNlUmVmPEhUTUxJbnB1dEVsZW1lbnQ+KG51bGwpO1xuXG4gIGNvbnN0IGhhbmRsZUlucHV0Q2hhbmdlID0gKGU6IENoYW5nZUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgc2V0SW5wdXQoZS50YXJnZXQudmFsdWUpO1xuICB9O1xuXG4gIGNvbnN0IG9uS2V5ZG93biA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIGlucHV0LnRyaW0oKSkge1xuICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgb25BZGRGb2xkZXIoaW5wdXQpO1xuICAgIH0gZWxzZSBpZiAoZS5rZXkgPT09ICdFc2NhcGUnKSB7XG4gICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICBvbkNsb3NlKCk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZElucHV0XG4gICAgICBhdXRvU2VsZWN0PXthdXRvU2VsZWN0fVxuICAgICAgY3VzdG9tQ3NzPXtpbnB1dFdyYXBwZXJTdHlsZX1cbiAgICAgIHdhcm5pbmdUZXh0PXshaW5wdXQudHJpbSgpID8gdCgnbXlOZGxhLmZvbGRlci5taXNzaW5nTmFtZScpIDogdW5kZWZpbmVkfVxuICAgICAgcmVmPXtpbnB1dFJlZn1cbiAgICAgIHZhbHVlPXtpbnB1dH1cbiAgICAgIG9uQ2hhbmdlPXtoYW5kbGVJbnB1dENoYW5nZX1cbiAgICAgIG9uS2V5RG93bj17b25LZXlkb3dufVxuICAgICAgYXJpYS1sYWJlbD17bmV3Rm9sZGVyVGV4dH1cbiAgICAgIGljb25MZWZ0PXtcbiAgICAgICAgPFN0eWxlZEZvbGRlckljb24+XG4gICAgICAgICAgPEZvbGRlck91dGxpbmVkIC8+XG4gICAgICAgIDwvU3R5bGVkRm9sZGVySWNvbj5cbiAgICAgIH1cbiAgICAgIGljb25SaWdodD17XG4gICAgICAgIDxSb3c+XG4gICAgICAgICAgPEljb25CdXR0b24gYXJpYS1sYWJlbD17dCgnY2xvc2UnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9e29uQ2xvc2V9PlxuICAgICAgICAgICAgPENyb3NzIC8+XG4gICAgICAgICAgPC9JY29uQnV0dG9uPlxuICAgICAgICAgIDxJY29uQnV0dG9uIGFyaWEtbGFiZWw9e3QoJ3NhdmUnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9eygpID0+IG9uQWRkRm9sZGVyKGlucHV0KX0+XG4gICAgICAgICAgICA8RG9uZSAvPlxuICAgICAgICAgIDwvSWNvbkJ1dHRvbj5cbiAgICAgICAgPC9Sb3c+XG4gICAgICB9XG4gICAgLz5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlcklucHV0O1xuIl19 */"));
+// Source: https://kovart.github.io/dashed-border-generator/
+var borderStyle = function borderStyle(error) {
+  return "url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='".concat(encodeURIComponent(error ? colors.support.red : colors.brand.tertiary), "' stroke-width='2' stroke-dasharray='8%2c8' stroke-dashoffset='4' stroke-linecap='square'/%3e%3c/svg%3e\")");
+};
 
-var StyledInput = /*#__PURE__*/_styled(Input, {
-  target: "esbqk1r1",
+var StyledInput = /*#__PURE__*/_styled(InputV2, {
+  target: "esbqk1r0",
   label: "StyledInput"
-})("&&{flex-grow:1;flex-basis:0;min-width:0;line-height:1.75em;color:", colors.brand.primary, ";::selection{background:", colors.brand.lighter, ";}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlcklucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5Q2lDIiwiZmlsZSI6IkZvbGRlcklucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiB9IGZyb20gJ0BuZGxhL2J1dHRvbic7XG5pbXBvcnQgeyBGb2xkZXJPdXRsaW5lZCB9IGZyb20gJ0BuZGxhL2ljb25zL2NvbnRlbnRUeXBlJztcbmltcG9ydCB7IENyb3NzIH0gZnJvbSAnQG5kbGEvaWNvbnMvYWN0aW9uJztcbmltcG9ydCBSZWFjdCwgeyBDaGFuZ2VFdmVudCwgS2V5Ym9hcmRFdmVudCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IElucHV0IH0gZnJvbSAnQG5kbGEvZm9ybXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XG5pbXBvcnQgeyBEb25lIH0gZnJvbSAnQG5kbGEvaWNvbnMvZWRpdG9yJztcblxuLy8gU291cmNlOiBodHRwczovL2tvdmFydC5naXRodWIuaW8vZGFzaGVkLWJvcmRlci1nZW5lcmF0b3IvXG5jb25zdCBib3JkZXJTdHlsZSA9IGB1cmwoXCJkYXRhOmltYWdlL3N2Zyt4bWwsJTNjc3ZnIHdpZHRoPScxMDAlMjUnIGhlaWdodD0nMTAwJTI1JyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnJTNlJTNjcmVjdCB3aWR0aD0nMTAwJTI1JyBoZWlnaHQ9JzEwMCUyNScgZmlsbD0nbm9uZScgc3Ryb2tlPScke2VuY29kZVVSSUNvbXBvbmVudChcbiAgY29sb3JzLmJyYW5kLnRlcnRpYXJ5LFxuKX0nIHN0cm9rZS13aWR0aD0nMicgc3Ryb2tlLWRhc2hhcnJheT0nOCUyYzgnIHN0cm9rZS1kYXNob2Zmc2V0PSc0JyBzdHJva2UtbGluZWNhcD0nc3F1YXJlJy8lM2UlM2Mvc3ZnJTNlXCIpYDtcblxuY29uc3QgU3R5bGVkRm9sZGVySWNvbiA9IHN0eWxlZC5zcGFuYFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBzdmcge1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgICBoZWlnaHQ6IDIwcHg7XG4gICAgd2lkdGg6IDIwcHg7XG4gIH1cbmA7XG5cbmNvbnN0IGlucHV0V3JhcHBlclN0eWxlID0gY3NzYFxuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBiYWNrZ3JvdW5kOiBub25lO1xuICBiYWNrZ3JvdW5kLWltYWdlOiAke2JvcmRlclN0eWxlfTtcbiAgYm9yZGVyOiBub25lO1xuYDtcblxuY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoSW5wdXQpYFxuICAmJiB7XG4gICAgZmxleC1ncm93OiAxO1xuICAgIGZsZXgtYmFzaXM6IDA7XG4gICAgbWluLXdpZHRoOiAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxLjc1ZW07XG4gICAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuICAgIDo6c2VsZWN0aW9uIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7Y29sb3JzLmJyYW5kLmxpZ2h0ZXJ9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgUm93ID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiAke3NwYWNpbmcueHNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLnNtYWxsfTtcbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIG9uQWRkRm9sZGVyOiAobmFtZTogc3RyaW5nKSA9PiB2b2lkO1xuICBvbkNsb3NlOiAoKSA9PiB2b2lkO1xuICBhdXRvU2VsZWN0PzogYm9vbGVhbjtcbn1cblxuY29uc3QgRm9sZGVySW5wdXQgPSAoeyBvbkFkZEZvbGRlciwgb25DbG9zZSwgYXV0b1NlbGVjdCB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IG5ld0ZvbGRlclRleHQgPSB0KCd0cmVlU3RydWN0dXJlLm5ld0ZvbGRlci5kZWZhdWx0TmFtZScpO1xuICBjb25zdCBbaW5wdXQsIHNldElucHV0XSA9IHVzZVN0YXRlPHN0cmluZz4obmV3Rm9sZGVyVGV4dCk7XG4gIGNvbnN0IGlucHV0UmVmID0gdXNlUmVmPEhUTUxJbnB1dEVsZW1lbnQ+KG51bGwpO1xuXG4gIGNvbnN0IGhhbmRsZUlucHV0Q2hhbmdlID0gKGU6IENoYW5nZUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgc2V0SW5wdXQoZS50YXJnZXQudmFsdWUpO1xuICB9O1xuXG4gIGNvbnN0IG9uS2V5ZG93biA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIGlucHV0LnRyaW0oKSkge1xuICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgb25BZGRGb2xkZXIoaW5wdXQpO1xuICAgIH0gZWxzZSBpZiAoZS5rZXkgPT09ICdFc2NhcGUnKSB7XG4gICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICBvbkNsb3NlKCk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZElucHV0XG4gICAgICBhdXRvU2VsZWN0PXthdXRvU2VsZWN0fVxuICAgICAgY3VzdG9tQ3NzPXtpbnB1dFdyYXBwZXJTdHlsZX1cbiAgICAgIHdhcm5pbmdUZXh0PXshaW5wdXQudHJpbSgpID8gdCgnbXlOZGxhLmZvbGRlci5taXNzaW5nTmFtZScpIDogdW5kZWZpbmVkfVxuICAgICAgcmVmPXtpbnB1dFJlZn1cbiAgICAgIHZhbHVlPXtpbnB1dH1cbiAgICAgIG9uQ2hhbmdlPXtoYW5kbGVJbnB1dENoYW5nZX1cbiAgICAgIG9uS2V5RG93bj17b25LZXlkb3dufVxuICAgICAgYXJpYS1sYWJlbD17bmV3Rm9sZGVyVGV4dH1cbiAgICAgIGljb25MZWZ0PXtcbiAgICAgICAgPFN0eWxlZEZvbGRlckljb24+XG4gICAgICAgICAgPEZvbGRlck91dGxpbmVkIC8+XG4gICAgICAgIDwvU3R5bGVkRm9sZGVySWNvbj5cbiAgICAgIH1cbiAgICAgIGljb25SaWdodD17XG4gICAgICAgIDxSb3c+XG4gICAgICAgICAgPEljb25CdXR0b24gYXJpYS1sYWJlbD17dCgnY2xvc2UnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9e29uQ2xvc2V9PlxuICAgICAgICAgICAgPENyb3NzIC8+XG4gICAgICAgICAgPC9JY29uQnV0dG9uPlxuICAgICAgICAgIDxJY29uQnV0dG9uIGFyaWEtbGFiZWw9e3QoJ3NhdmUnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9eygpID0+IG9uQWRkRm9sZGVyKGlucHV0KX0+XG4gICAgICAgICAgICA8RG9uZSAvPlxuICAgICAgICAgIDwvSWNvbkJ1dHRvbj5cbiAgICAgICAgPC9Sb3c+XG4gICAgICB9XG4gICAgLz5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlcklucHV0O1xuIl19 */"));
+})("background-color:white;background-image:", function (_ref) {
+  var error = _ref.error;
+  return borderStyle(!!error);
+}, ";border:none;border-radius:0;flex-wrap:nowrap;input{line-height:1.75em;color:", colors.brand.primary, ";caret-color:", colors.brand.tertiary, ";::selection{background:", colors.brand.lighter, ";}::placeholder{color:", colors.brand.tertiary, ";}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlcklucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQ3FEIiwiZmlsZSI6IkZvbGRlcklucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiwgSWNvbkJ1dHRvblYyIH0gZnJvbSAnQG5kbGEvYnV0dG9uJztcbmltcG9ydCB7IENyb3NzIH0gZnJvbSAnQG5kbGEvaWNvbnMvYWN0aW9uJztcbmltcG9ydCBSZWFjdCwgeyBDb21wb25lbnRQcm9wcywgZm9yd2FyZFJlZiwgdXNlRWZmZWN0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgaXNNb2JpbGUgfSBmcm9tICdyZWFjdC1kZXZpY2UtZGV0ZWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IElucHV0VjIgfSBmcm9tICdAbmRsYS9mb3Jtcyc7XG5pbXBvcnQgeyBEb25lIH0gZnJvbSAnQG5kbGEvaWNvbnMvZWRpdG9yJztcbmltcG9ydCB7IFNwaW5uZXIgfSBmcm9tICdAbmRsYS9pY29ucyc7XG5pbXBvcnQgeyB1c2VGb3J3YXJkZWRSZWYgfSBmcm9tICdAbmRsYS91dGlsJztcblxuaW50ZXJmYWNlIFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHM8dHlwZW9mIElucHV0VjI+IHtcbiAgbG9hZGluZz86IGJvb2xlYW47XG4gIG9uQ2xvc2U/OiAoKSA9PiB2b2lkO1xuICBvblNhdmU6ICgpID0+IHZvaWQ7XG59XG5cbi8vIFNvdXJjZTogaHR0cHM6Ly9rb3ZhcnQuZ2l0aHViLmlvL2Rhc2hlZC1ib3JkZXItZ2VuZXJhdG9yL1xuY29uc3QgYm9yZGVyU3R5bGUgPSAoZXJyb3I/OiBib29sZWFuKSA9PlxuICBgdXJsKFwiZGF0YTppbWFnZS9zdmcreG1sLCUzY3N2ZyB3aWR0aD0nMTAwJTI1JyBoZWlnaHQ9JzEwMCUyNScgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJyUzZSUzY3JlY3Qgd2lkdGg9JzEwMCUyNScgaGVpZ2h0PScxMDAlMjUnIGZpbGw9J25vbmUnIHN0cm9rZT0nJHtlbmNvZGVVUklDb21wb25lbnQoXG4gICAgZXJyb3IgPyBjb2xvcnMuc3VwcG9ydC5yZWQgOiBjb2xvcnMuYnJhbmQudGVydGlhcnksXG4gICl9JyBzdHJva2Utd2lkdGg9JzInIHN0cm9rZS1kYXNoYXJyYXk9JzglMmM4JyBzdHJva2UtZGFzaG9mZnNldD0nNCcgc3Ryb2tlLWxpbmVjYXA9J3NxdWFyZScvJTNlJTNjL3N2ZyUzZVwiKWA7XG5cbmludGVyZmFjZSBTdHlsZWRJbnB1dFByb3BzIHtcbiAgZXJyb3I/OiBzdHJpbmc7XG59XG5cbmNvbnN0IFN0eWxlZElucHV0ID0gc3R5bGVkKElucHV0VjIpPFN0eWxlZElucHV0UHJvcHM+YFxuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgYmFja2dyb3VuZC1pbWFnZTogJHsoeyBlcnJvciB9KSA9PiBib3JkZXJTdHlsZSghIWVycm9yKX07XG4gIGJvcmRlcjogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogMDtcbiAgZmxleC13cmFwOiBub3dyYXA7XG4gIGlucHV0IHtcbiAgICBsaW5lLWhlaWdodDogMS43NWVtO1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgICBjYXJldC1jb2xvcjogJHtjb2xvcnMuYnJhbmQudGVydGlhcnl9O1xuICAgIDo6c2VsZWN0aW9uIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7Y29sb3JzLmJyYW5kLmxpZ2h0ZXJ9O1xuICAgIH1cbiAgICA6OnBsYWNlaG9sZGVyIHtcbiAgICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC50ZXJ0aWFyeX07XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBSb3cgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5jb25zdCBGb2xkZXJJbnB1dCA9IGZvcndhcmRSZWY8SFRNTElucHV0RWxlbWVudCwgUHJvcHM+KCh7IGxvYWRpbmcsIGVycm9yLCBvbkNsb3NlLCBvblNhdmUsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gIGNvbnN0IHsgdCB9ID0gdXNlVHJhbnNsYXRpb24oKTtcbiAgY29uc3QgaW5wdXRSZWYgPSB1c2VGb3J3YXJkZWRSZWYocmVmKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChpc01vYmlsZSkge1xuICAgICAgaW5wdXRSZWYuY3VycmVudD8uc2Nyb2xsSW50b1ZpZXcoeyBiZWhhdmlvcjogJ3Ntb290aCcgfSk7XG4gICAgfVxuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC1ob29rcy9leGhhdXN0aXZlLWRlcHNcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZElucHV0XG4gICAgICB3aGl0ZVxuICAgICAgZXJyb3I9e2Vycm9yfVxuICAgICAgYXJpYS1kaXNhYmxlZD17bG9hZGluZyA/IHRydWUgOiB1bmRlZmluZWR9XG4gICAgICBhcmlhLWRlc2NyaWJlZGJ5PXsnZm9sZGVyLWlucHV0LXNwaW5uZXInfVxuICAgICAgcmVmPXtyZWZ9XG4gICAgICBhZnRlcj17XG4gICAgICAgIDxSb3c+XG4gICAgICAgICAgeyFsb2FkaW5nICYmIChcbiAgICAgICAgICAgIDw+XG4gICAgICAgICAgICAgIHshZXJyb3IgJiYgKFxuICAgICAgICAgICAgICAgIDxJY29uQnV0dG9uVjJcbiAgICAgICAgICAgICAgICAgIHZhcmlhbnQ9eydnaG9zdCd9XG4gICAgICAgICAgICAgICAgICBjb2xvclRoZW1lPVwibGlnaHRcIlxuICAgICAgICAgICAgICAgICAgdGFiSW5kZXg9ezB9XG4gICAgICAgICAgICAgICAgICBhcmlhLWxhYmVsPXt0KCdzYXZlJyl9XG4gICAgICAgICAgICAgICAgICB0aXRsZT17dCgnc2F2ZScpfVxuICAgICAgICAgICAgICAgICAgc2l6ZT1cInNtYWxsXCJcbiAgICAgICAgICAgICAgICAgIG9uQ2xpY2s9e29uU2F2ZX0+XG4gICAgICAgICAgICAgICAgICA8RG9uZSAvPlxuICAgICAgICAgICAgICAgIDwvSWNvbkJ1dHRvblYyPlxuICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgICA8SWNvbkJ1dHRvbiBhcmlhLWxhYmVsPXt0KCdjbG9zZScpfSB0aXRsZT17dCgnY2xvc2UnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9e29uQ2xvc2V9PlxuICAgICAgICAgICAgICAgIDxDcm9zcyAvPlxuICAgICAgICAgICAgICA8L0ljb25CdXR0b24+XG4gICAgICAgICAgICA8Lz5cbiAgICAgICAgICApfVxuICAgICAgICAgIDxkaXYgYXJpYS1saXZlPVwiYXNzZXJ0aXZlXCI+XG4gICAgICAgICAgICB7bG9hZGluZyAmJiA8U3Bpbm5lciBzaXplPVwibm9ybWFsXCIgbWFyZ2luPXtzcGFjaW5nLnNtYWxsfSBpZD1cImZvbGRlci1zcGlubmVyXCIgYXJpYS1sYWJlbD17dCgnbG9hZGluZycpfSAvPn1cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9Sb3c+XG4gICAgICB9XG4gICAgICB7Li4ucmVzdH1cbiAgICAvPlxuICApO1xufSk7XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlcklucHV0O1xuIl19 */"));
 
 var Row = _styled("div", {
-  target: "esbqk1r2",
+  target: "esbqk1r1",
   label: "Row"
-})("display:flex;gap:", spacing.xsmall, ";padding-right:", spacing.small, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlcklucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzRHNCIiwiZmlsZSI6IkZvbGRlcklucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiB9IGZyb20gJ0BuZGxhL2J1dHRvbic7XG5pbXBvcnQgeyBGb2xkZXJPdXRsaW5lZCB9IGZyb20gJ0BuZGxhL2ljb25zL2NvbnRlbnRUeXBlJztcbmltcG9ydCB7IENyb3NzIH0gZnJvbSAnQG5kbGEvaWNvbnMvYWN0aW9uJztcbmltcG9ydCBSZWFjdCwgeyBDaGFuZ2VFdmVudCwgS2V5Ym9hcmRFdmVudCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IElucHV0IH0gZnJvbSAnQG5kbGEvZm9ybXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XG5pbXBvcnQgeyBEb25lIH0gZnJvbSAnQG5kbGEvaWNvbnMvZWRpdG9yJztcblxuLy8gU291cmNlOiBodHRwczovL2tvdmFydC5naXRodWIuaW8vZGFzaGVkLWJvcmRlci1nZW5lcmF0b3IvXG5jb25zdCBib3JkZXJTdHlsZSA9IGB1cmwoXCJkYXRhOmltYWdlL3N2Zyt4bWwsJTNjc3ZnIHdpZHRoPScxMDAlMjUnIGhlaWdodD0nMTAwJTI1JyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnJTNlJTNjcmVjdCB3aWR0aD0nMTAwJTI1JyBoZWlnaHQ9JzEwMCUyNScgZmlsbD0nbm9uZScgc3Ryb2tlPScke2VuY29kZVVSSUNvbXBvbmVudChcbiAgY29sb3JzLmJyYW5kLnRlcnRpYXJ5LFxuKX0nIHN0cm9rZS13aWR0aD0nMicgc3Ryb2tlLWRhc2hhcnJheT0nOCUyYzgnIHN0cm9rZS1kYXNob2Zmc2V0PSc0JyBzdHJva2UtbGluZWNhcD0nc3F1YXJlJy8lM2UlM2Mvc3ZnJTNlXCIpYDtcblxuY29uc3QgU3R5bGVkRm9sZGVySWNvbiA9IHN0eWxlZC5zcGFuYFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBzdmcge1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgICBoZWlnaHQ6IDIwcHg7XG4gICAgd2lkdGg6IDIwcHg7XG4gIH1cbmA7XG5cbmNvbnN0IGlucHV0V3JhcHBlclN0eWxlID0gY3NzYFxuICBwYWRkaW5nOiAke3NwYWNpbmcuc21hbGx9O1xuICBiYWNrZ3JvdW5kOiBub25lO1xuICBiYWNrZ3JvdW5kLWltYWdlOiAke2JvcmRlclN0eWxlfTtcbiAgYm9yZGVyOiBub25lO1xuYDtcblxuY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoSW5wdXQpYFxuICAmJiB7XG4gICAgZmxleC1ncm93OiAxO1xuICAgIGZsZXgtYmFzaXM6IDA7XG4gICAgbWluLXdpZHRoOiAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxLjc1ZW07XG4gICAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuICAgIDo6c2VsZWN0aW9uIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7Y29sb3JzLmJyYW5kLmxpZ2h0ZXJ9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgUm93ID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiAke3NwYWNpbmcueHNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLnNtYWxsfTtcbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIG9uQWRkRm9sZGVyOiAobmFtZTogc3RyaW5nKSA9PiB2b2lkO1xuICBvbkNsb3NlOiAoKSA9PiB2b2lkO1xuICBhdXRvU2VsZWN0PzogYm9vbGVhbjtcbn1cblxuY29uc3QgRm9sZGVySW5wdXQgPSAoeyBvbkFkZEZvbGRlciwgb25DbG9zZSwgYXV0b1NlbGVjdCB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IG5ld0ZvbGRlclRleHQgPSB0KCd0cmVlU3RydWN0dXJlLm5ld0ZvbGRlci5kZWZhdWx0TmFtZScpO1xuICBjb25zdCBbaW5wdXQsIHNldElucHV0XSA9IHVzZVN0YXRlPHN0cmluZz4obmV3Rm9sZGVyVGV4dCk7XG4gIGNvbnN0IGlucHV0UmVmID0gdXNlUmVmPEhUTUxJbnB1dEVsZW1lbnQ+KG51bGwpO1xuXG4gIGNvbnN0IGhhbmRsZUlucHV0Q2hhbmdlID0gKGU6IENoYW5nZUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgc2V0SW5wdXQoZS50YXJnZXQudmFsdWUpO1xuICB9O1xuXG4gIGNvbnN0IG9uS2V5ZG93biA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIGlucHV0LnRyaW0oKSkge1xuICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgb25BZGRGb2xkZXIoaW5wdXQpO1xuICAgIH0gZWxzZSBpZiAoZS5rZXkgPT09ICdFc2NhcGUnKSB7XG4gICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICBvbkNsb3NlKCk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZElucHV0XG4gICAgICBhdXRvU2VsZWN0PXthdXRvU2VsZWN0fVxuICAgICAgY3VzdG9tQ3NzPXtpbnB1dFdyYXBwZXJTdHlsZX1cbiAgICAgIHdhcm5pbmdUZXh0PXshaW5wdXQudHJpbSgpID8gdCgnbXlOZGxhLmZvbGRlci5taXNzaW5nTmFtZScpIDogdW5kZWZpbmVkfVxuICAgICAgcmVmPXtpbnB1dFJlZn1cbiAgICAgIHZhbHVlPXtpbnB1dH1cbiAgICAgIG9uQ2hhbmdlPXtoYW5kbGVJbnB1dENoYW5nZX1cbiAgICAgIG9uS2V5RG93bj17b25LZXlkb3dufVxuICAgICAgYXJpYS1sYWJlbD17bmV3Rm9sZGVyVGV4dH1cbiAgICAgIGljb25MZWZ0PXtcbiAgICAgICAgPFN0eWxlZEZvbGRlckljb24+XG4gICAgICAgICAgPEZvbGRlck91dGxpbmVkIC8+XG4gICAgICAgIDwvU3R5bGVkRm9sZGVySWNvbj5cbiAgICAgIH1cbiAgICAgIGljb25SaWdodD17XG4gICAgICAgIDxSb3c+XG4gICAgICAgICAgPEljb25CdXR0b24gYXJpYS1sYWJlbD17dCgnY2xvc2UnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9e29uQ2xvc2V9PlxuICAgICAgICAgICAgPENyb3NzIC8+XG4gICAgICAgICAgPC9JY29uQnV0dG9uPlxuICAgICAgICAgIDxJY29uQnV0dG9uIGFyaWEtbGFiZWw9e3QoJ3NhdmUnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9eygpID0+IG9uQWRkRm9sZGVyKGlucHV0KX0+XG4gICAgICAgICAgICA8RG9uZSAvPlxuICAgICAgICAgIDwvSWNvbkJ1dHRvbj5cbiAgICAgICAgPC9Sb3c+XG4gICAgICB9XG4gICAgLz5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlcklucHV0O1xuIl19 */"));
+})("display:flex;align-items:center;gap:", spacing.xxsmall, ";padding-right:", spacing.xsmall, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlcklucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1RHNCIiwiZmlsZSI6IkZvbGRlcklucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiwgSWNvbkJ1dHRvblYyIH0gZnJvbSAnQG5kbGEvYnV0dG9uJztcbmltcG9ydCB7IENyb3NzIH0gZnJvbSAnQG5kbGEvaWNvbnMvYWN0aW9uJztcbmltcG9ydCBSZWFjdCwgeyBDb21wb25lbnRQcm9wcywgZm9yd2FyZFJlZiwgdXNlRWZmZWN0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgaXNNb2JpbGUgfSBmcm9tICdyZWFjdC1kZXZpY2UtZGV0ZWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IElucHV0VjIgfSBmcm9tICdAbmRsYS9mb3Jtcyc7XG5pbXBvcnQgeyBEb25lIH0gZnJvbSAnQG5kbGEvaWNvbnMvZWRpdG9yJztcbmltcG9ydCB7IFNwaW5uZXIgfSBmcm9tICdAbmRsYS9pY29ucyc7XG5pbXBvcnQgeyB1c2VGb3J3YXJkZWRSZWYgfSBmcm9tICdAbmRsYS91dGlsJztcblxuaW50ZXJmYWNlIFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHM8dHlwZW9mIElucHV0VjI+IHtcbiAgbG9hZGluZz86IGJvb2xlYW47XG4gIG9uQ2xvc2U/OiAoKSA9PiB2b2lkO1xuICBvblNhdmU6ICgpID0+IHZvaWQ7XG59XG5cbi8vIFNvdXJjZTogaHR0cHM6Ly9rb3ZhcnQuZ2l0aHViLmlvL2Rhc2hlZC1ib3JkZXItZ2VuZXJhdG9yL1xuY29uc3QgYm9yZGVyU3R5bGUgPSAoZXJyb3I/OiBib29sZWFuKSA9PlxuICBgdXJsKFwiZGF0YTppbWFnZS9zdmcreG1sLCUzY3N2ZyB3aWR0aD0nMTAwJTI1JyBoZWlnaHQ9JzEwMCUyNScgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJyUzZSUzY3JlY3Qgd2lkdGg9JzEwMCUyNScgaGVpZ2h0PScxMDAlMjUnIGZpbGw9J25vbmUnIHN0cm9rZT0nJHtlbmNvZGVVUklDb21wb25lbnQoXG4gICAgZXJyb3IgPyBjb2xvcnMuc3VwcG9ydC5yZWQgOiBjb2xvcnMuYnJhbmQudGVydGlhcnksXG4gICl9JyBzdHJva2Utd2lkdGg9JzInIHN0cm9rZS1kYXNoYXJyYXk9JzglMmM4JyBzdHJva2UtZGFzaG9mZnNldD0nNCcgc3Ryb2tlLWxpbmVjYXA9J3NxdWFyZScvJTNlJTNjL3N2ZyUzZVwiKWA7XG5cbmludGVyZmFjZSBTdHlsZWRJbnB1dFByb3BzIHtcbiAgZXJyb3I/OiBzdHJpbmc7XG59XG5cbmNvbnN0IFN0eWxlZElucHV0ID0gc3R5bGVkKElucHV0VjIpPFN0eWxlZElucHV0UHJvcHM+YFxuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgYmFja2dyb3VuZC1pbWFnZTogJHsoeyBlcnJvciB9KSA9PiBib3JkZXJTdHlsZSghIWVycm9yKX07XG4gIGJvcmRlcjogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogMDtcbiAgZmxleC13cmFwOiBub3dyYXA7XG4gIGlucHV0IHtcbiAgICBsaW5lLWhlaWdodDogMS43NWVtO1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgICBjYXJldC1jb2xvcjogJHtjb2xvcnMuYnJhbmQudGVydGlhcnl9O1xuICAgIDo6c2VsZWN0aW9uIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7Y29sb3JzLmJyYW5kLmxpZ2h0ZXJ9O1xuICAgIH1cbiAgICA6OnBsYWNlaG9sZGVyIHtcbiAgICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC50ZXJ0aWFyeX07XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBSb3cgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5jb25zdCBGb2xkZXJJbnB1dCA9IGZvcndhcmRSZWY8SFRNTElucHV0RWxlbWVudCwgUHJvcHM+KCh7IGxvYWRpbmcsIGVycm9yLCBvbkNsb3NlLCBvblNhdmUsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gIGNvbnN0IHsgdCB9ID0gdXNlVHJhbnNsYXRpb24oKTtcbiAgY29uc3QgaW5wdXRSZWYgPSB1c2VGb3J3YXJkZWRSZWYocmVmKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChpc01vYmlsZSkge1xuICAgICAgaW5wdXRSZWYuY3VycmVudD8uc2Nyb2xsSW50b1ZpZXcoeyBiZWhhdmlvcjogJ3Ntb290aCcgfSk7XG4gICAgfVxuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC1ob29rcy9leGhhdXN0aXZlLWRlcHNcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZElucHV0XG4gICAgICB3aGl0ZVxuICAgICAgZXJyb3I9e2Vycm9yfVxuICAgICAgYXJpYS1kaXNhYmxlZD17bG9hZGluZyA/IHRydWUgOiB1bmRlZmluZWR9XG4gICAgICBhcmlhLWRlc2NyaWJlZGJ5PXsnZm9sZGVyLWlucHV0LXNwaW5uZXInfVxuICAgICAgcmVmPXtyZWZ9XG4gICAgICBhZnRlcj17XG4gICAgICAgIDxSb3c+XG4gICAgICAgICAgeyFsb2FkaW5nICYmIChcbiAgICAgICAgICAgIDw+XG4gICAgICAgICAgICAgIHshZXJyb3IgJiYgKFxuICAgICAgICAgICAgICAgIDxJY29uQnV0dG9uVjJcbiAgICAgICAgICAgICAgICAgIHZhcmlhbnQ9eydnaG9zdCd9XG4gICAgICAgICAgICAgICAgICBjb2xvclRoZW1lPVwibGlnaHRcIlxuICAgICAgICAgICAgICAgICAgdGFiSW5kZXg9ezB9XG4gICAgICAgICAgICAgICAgICBhcmlhLWxhYmVsPXt0KCdzYXZlJyl9XG4gICAgICAgICAgICAgICAgICB0aXRsZT17dCgnc2F2ZScpfVxuICAgICAgICAgICAgICAgICAgc2l6ZT1cInNtYWxsXCJcbiAgICAgICAgICAgICAgICAgIG9uQ2xpY2s9e29uU2F2ZX0+XG4gICAgICAgICAgICAgICAgICA8RG9uZSAvPlxuICAgICAgICAgICAgICAgIDwvSWNvbkJ1dHRvblYyPlxuICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgICA8SWNvbkJ1dHRvbiBhcmlhLWxhYmVsPXt0KCdjbG9zZScpfSB0aXRsZT17dCgnY2xvc2UnKX0gc2l6ZT1cInNtYWxsXCIgZ2hvc3RQaWxsIG9uQ2xpY2s9e29uQ2xvc2V9PlxuICAgICAgICAgICAgICAgIDxDcm9zcyAvPlxuICAgICAgICAgICAgICA8L0ljb25CdXR0b24+XG4gICAgICAgICAgICA8Lz5cbiAgICAgICAgICApfVxuICAgICAgICAgIDxkaXYgYXJpYS1saXZlPVwiYXNzZXJ0aXZlXCI+XG4gICAgICAgICAgICB7bG9hZGluZyAmJiA8U3Bpbm5lciBzaXplPVwibm9ybWFsXCIgbWFyZ2luPXtzcGFjaW5nLnNtYWxsfSBpZD1cImZvbGRlci1zcGlubmVyXCIgYXJpYS1sYWJlbD17dCgnbG9hZGluZycpfSAvPn1cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9Sb3c+XG4gICAgICB9XG4gICAgICB7Li4ucmVzdH1cbiAgICAvPlxuICApO1xufSk7XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlcklucHV0O1xuIl19 */"));
 
-var FolderInput = function FolderInput(_ref) {
-  var onAddFolder = _ref.onAddFolder,
-      onClose = _ref.onClose,
-      autoSelect = _ref.autoSelect;
+var FolderInput = /*#__PURE__*/forwardRef(function (_ref2, ref) {
+  var loading = _ref2.loading,
+      error = _ref2.error,
+      onClose = _ref2.onClose,
+      onSave = _ref2.onSave,
+      rest = _objectWithoutProperties(_ref2, ["loading", "error", "onClose", "onSave"]);
 
   var _useTranslation = useTranslation(),
       t = _useTranslation.t;
 
-  var newFolderText = t('treeStructure.newFolder.defaultName');
-
-  var _useState = useState(newFolderText),
-      _useState2 = _slicedToArray(_useState, 2),
-      input = _useState2[0],
-      setInput = _useState2[1];
-
-  var inputRef = useRef(null);
-
-  var handleInputChange = function handleInputChange(e) {
-    setInput(e.target.value);
-  };
-
-  var onKeydown = function onKeydown(e) {
-    if (e.key === 'Enter' && input.trim()) {
-      e.preventDefault();
-      onAddFolder(input);
-    } else if (e.key === 'Escape') {
-      e.preventDefault();
-      onClose();
-    }
-  };
-
-  return ___EmotionJSX(StyledInput, {
-    autoSelect: autoSelect,
-    customCss: inputWrapperStyle,
-    warningText: !input.trim() ? t('myNdla.folder.missingName') : undefined,
-    ref: inputRef,
-    value: input,
-    onChange: handleInputChange,
-    onKeyDown: onKeydown,
-    "aria-label": newFolderText,
-    iconLeft: ___EmotionJSX(StyledFolderIcon, null, ___EmotionJSX(FolderOutlined, null)),
-    iconRight: ___EmotionJSX(Row, null, ___EmotionJSX(IconButton, {
+  var inputRef = useForwardedRef(ref);
+  useEffect(function () {
+    if (isMobile) {
+      var _inputRef$current;
+
+      (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.scrollIntoView({
+        behavior: 'smooth'
+      });
+    } // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  }, []);
+  return ___EmotionJSX(StyledInput, _extends({
+    white: true,
+    error: error,
+    "aria-disabled": loading ? true : undefined,
+    "aria-describedby": 'folder-input-spinner',
+    ref: ref,
+    after: ___EmotionJSX(Row, null, !loading && ___EmotionJSX(React.Fragment, null, !error && ___EmotionJSX(IconButtonV2, {
+      variant: 'ghost',
+      colorTheme: "light",
+      tabIndex: 0,
+      "aria-label": t('save'),
+      title: t('save'),
+      size: "small",
+      onClick: onSave
+    }, ___EmotionJSX(Done, null)), ___EmotionJSX(IconButton, {
       "aria-label": t('close'),
+      title: t('close'),
       size: "small",
       ghostPill: true,
       onClick: onClose
-    }, ___EmotionJSX(Cross, null)), ___EmotionJSX(IconButton, {
-      "aria-label": t('save'),
-      size: "small",
-      ghostPill: true,
-      onClick: function onClick() {
-        return onAddFolder(input);
-      }
-    }, ___EmotionJSX(Done, null)))
-  });
-};
-
+    }, ___EmotionJSX(Cross, null))), ___EmotionJSX("div", {
+      "aria-live": "assertive"
+    }, loading && ___EmotionJSX(Spinner, {
+      size: "normal",
+      margin: spacing.small,
+      id: "folder-spinner",
+      "aria-label": t('loading')
+    })))
+  }, rest));
+});
 export default FolderInput;