@ndla/ui 14.0.0 → 15.1.1

package/lib/TagSelector/TagSelector.js

@@ -0,0 +1,150 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _core = require("@ndla/core");
+
+var _util = require("@ndla/util");
+
+var _SuggestionInput = _interopRequireDefault(require("./SuggestionInput"));
+
+var _core2 = require("@emotion/core");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+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 _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 _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; }
+
+var DEFAULT_DROPDOWN_MAXHEIGHT = '240px';
+var StyledLabel = (0, _styledBase["default"])("label", {
+  target: "eor9swf0",
+  label: "StyledLabel"
+})("font-weight:", _core.fonts.weight.semibold, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZ1NlbGVjdG9yLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQmdDIiwiZmlsZSI6IlRhZ1NlbGVjdG9yLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjItcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgUmVhY3QsIHsgdXNlU3RhdGUsIHVzZVJlZiwgdXNlRWZmZWN0LCBDaGFuZ2VFdmVudCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHNwYWNpbmdVbml0LCBmb250cyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHsgdXVpZCB9IGZyb20gJ0BuZGxhL3V0aWwnO1xuaW1wb3J0IFN1Z2dlc3Rpb25JbnB1dCBmcm9tICcuL1N1Z2dlc3Rpb25JbnB1dCc7XG5cbmNvbnN0IERFRkFVTFRfRFJPUERPV05fTUFYSEVJR0hUID0gJzI0MHB4JztcblxuY29uc3QgU3R5bGVkTGFiZWwgPSBzdHlsZWQubGFiZWxgXG4gIGZvbnQtd2VpZ2h0OiAke2ZvbnRzLndlaWdodC5zZW1pYm9sZH07XG5gO1xuXG5leHBvcnQgaW50ZXJmYWNlIFRhZ1R5cGUge1xuICBuYW1lOiBzdHJpbmc7XG4gIGlkOiBzdHJpbmc7XG59XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIGxhYmVsOiBzdHJpbmc7XG4gIHRhZ3M6IFRhZ1R5cGVbXTtcbiAgdGFnc1NlbGVjdGVkOiBzdHJpbmdbXTtcbiAgb25Ub2dnbGVUYWc6IChpZDogc3RyaW5nKSA9PiB2b2lkO1xuICBvbkNyZWF0ZVRhZzogKHRhZ05hbWU6IHN0cmluZykgPT4gdm9pZDtcbiAgaW5saW5lPzogYm9vbGVhbjtcbiAgcHJlZml4Pzogc3RyaW5nO1xufVxuXG5jb25zdCBzb3J0ZWRUYWdzID0gKHRhZ3M6IFRhZ1R5cGVbXSwgc2VsZWN0ZWRUYWdzOiBzdHJpbmdbXSk6IFRhZ1R5cGVbXSA9PlxuICB0YWdzXG4gICAgLmZpbHRlcigoeyBpZCB9KSA9PiBzZWxlY3RlZFRhZ3Muc29tZSgoaWRTZWxlY3RlZCkgPT4gaWRTZWxlY3RlZCA9PT0gaWQpKVxuICAgIC5zb3J0KChhLCBiKSA9PiBhLm5hbWUubG9jYWxlQ29tcGFyZShiLm5hbWUsICduYicpKTtcblxuY29uc3QgZ2V0U3VnZ2VzdGlvbnMgPSAodGFnczogVGFnVHlwZVtdLCBpbnB1dFZhbHVlOiBzdHJpbmcpOiBUYWdUeXBlW10gPT4ge1xuICBpZiAoaW5wdXRWYWx1ZSA9PT0gJycpIHtcbiAgICByZXR1cm4gW107XG4gIH1cbiAgY29uc3QgaW5wdXRMb3dlcmNhc2UgPSBpbnB1dFZhbHVlLnRvTG93ZXJDYXNlKCk7XG4gIHJldHVybiB0YWdzXG4gICAgLmZpbHRlcigoeyBuYW1lIH0pID0+IG5hbWUudG9Mb3dlckNhc2UoKS5zdGFydHNXaXRoKGlucHV0TG93ZXJjYXNlKSlcbiAgICAuc29ydCgoYSwgYikgPT4gYS5uYW1lLmxvY2FsZUNvbXBhcmUoYi5uYW1lLCAnbmInKSk7XG59O1xuXG5jb25zdCBUYWdTZWxlY3RvciA9ICh7IGxhYmVsLCB0YWdzLCB0YWdzU2VsZWN0ZWQsIG9uQ3JlYXRlVGFnLCBvblRvZ2dsZVRhZywgaW5saW5lLCBwcmVmaXggfTogUHJvcHMpID0+IHtcbiAgY29uc3QgW2lucHV0VmFsdWUsIHNldElucHV0VmFsdWVdID0gdXNlU3RhdGUoJycpO1xuICBjb25zdCBbZXhwYW5kZWQsIHNldEV4cGFuZGVkXSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgY29uc3QgW2Ryb3Bkb3duTWF4SGVpZ2h0LCBzZXREcm9wZG93bk1heEhlaWdodF0gPSB1c2VTdGF0ZShERUZBVUxUX0RST1BET1dOX01BWEhFSUdIVCk7XG4gIGNvbnN0IGNvbnRhaW5lclJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IGlucHV0SWRSZWYgPSB1c2VSZWY8c3RyaW5nPih1dWlkKCkpO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgc2V0RXhwYW5kZWQoZmFsc2UpO1xuICB9LCBbdGFnc1NlbGVjdGVkXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBjb25zdCBzZXRNYXhEcm9wZG93bk1heEhlaWdodCA9ICgpID0+IHtcbiAgICAgIGlmICghaW5saW5lICYmIGNvbnRhaW5lclJlZi5jdXJyZW50ICYmIHR5cGVvZiB3aW5kb3cgIT09ICd1bmRlZmluZWQnKSB7XG4gICAgICAgIC8vIENhbGN1bGF0ZSBkaXN0YW5jZSBmcm9tIGJvdHRvbSBvZiBjb250YWluZXIgdG8gYm90dG9tIG9mIHZpZXdwb3J0XG4gICAgICAgIGNvbnN0IGNvbnRhaW5lckJvdHRvbSA9IGNvbnRhaW5lclJlZi5jdXJyZW50LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLmJvdHRvbTtcbiAgICAgICAgY29uc3Qgdmlld3BvcnRCb3R0b20gPSBkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQuc2Nyb2xsSGVpZ2h0O1xuICAgICAgICBjb25zdCBtYXhEcm9wZG93bkhlaWdodCA9IHZpZXdwb3J0Qm90dG9tIC0gY29udGFpbmVyQm90dG9tO1xuICAgICAgICBzZXREcm9wZG93bk1heEhlaWdodChgJHttYXhEcm9wZG93bkhlaWdodCAtIHNwYWNpbmdVbml0fXB4YCk7XG4gICAgICB9XG4gICAgfTtcbiAgICBpZiAoIWlubGluZSAmJiB0eXBlb2Ygd2luZG93ICE9PSAndW5kZWZpbmVkJykge1xuICAgICAgaWYgKGV4cGFuZGVkKSB7XG4gICAgICAgIHNldE1heERyb3Bkb3duTWF4SGVpZ2h0KCk7XG4gICAgICAgIHdpbmRvdy5hZGRFdmVudExpc3RlbmVyKCdyZXNpemUnLCBzZXRNYXhEcm9wZG93bk1heEhlaWdodCk7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICB3aW5kb3cucmVtb3ZlRXZlbnRMaXN0ZW5lcigncmVzaXplJywgc2V0TWF4RHJvcGRvd25NYXhIZWlnaHQpO1xuICAgICAgfVxuICAgIH1cbiAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgdHlwZW9mIHdpbmRvdyAhPT0gJ3VuZGVmaW5lZCcgJiYgd2luZG93LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ3Jlc2l6ZScsIHNldE1heERyb3Bkb3duTWF4SGVpZ2h0KTtcbiAgICB9O1xuICB9LCBbZXhwYW5kZWQsIGlubGluZV0pO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdiByZWY9e2NvbnRhaW5lclJlZn0+XG4gICAgICA8U3R5bGVkTGFiZWwgaHRtbEZvcj17aW5wdXRJZFJlZi5jdXJyZW50fT57bGFiZWx9PC9TdHlsZWRMYWJlbD5cbiAgICAgIDxTdWdnZXN0aW9uSW5wdXRcbiAgICAgICAgb25DaGFuZ2U9eyhlOiBDaGFuZ2VFdmVudDxIVE1MSW5wdXRFbGVtZW50PikgPT4ge1xuICAgICAgICAgIGNvbnN0IHRhcmdldCA9IGUudGFyZ2V0IGFzIEhUTUxJbnB1dEVsZW1lbnQ7XG4gICAgICAgICAgc2V0SW5wdXRWYWx1ZSh0YXJnZXQudmFsdWUpO1xuICAgICAgICAgIHNldEV4cGFuZGVkKGZhbHNlKTtcbiAgICAgICAgfX1cbiAgICAgICAgc3VnZ2VzdGlvbnM9e2V4cGFuZGVkID8gdGFncyA6IGdldFN1Z2dlc3Rpb25zKHRhZ3MsIGlucHV0VmFsdWUpfVxuICAgICAgICB2YWx1ZT17aW5wdXRWYWx1ZX1cbiAgICAgICAgb25DcmVhdGVUYWc9e29uQ3JlYXRlVGFnfVxuICAgICAgICBvblRvZ2dsZVRhZz17b25Ub2dnbGVUYWd9XG4gICAgICAgIHNldElucHV0VmFsdWU9e3NldElucHV0VmFsdWV9XG4gICAgICAgIGFkZGVkVGFncz17c29ydGVkVGFncyh0YWdzLCB0YWdzU2VsZWN0ZWQpfVxuICAgICAgICBleHBhbmRlZD17ZXhwYW5kZWR9XG4gICAgICAgIHNldEV4cGFuZGVkPXtzZXRFeHBhbmRlZH1cbiAgICAgICAgZHJvcGRvd25NYXhIZWlnaHQ9e2Ryb3Bkb3duTWF4SGVpZ2h0fVxuICAgICAgICBpbmxpbmU9e2lubGluZX1cbiAgICAgICAgc2Nyb2xsQW5jaG9yRWxlbWVudD17Y29udGFpbmVyUmVmfVxuICAgICAgICBwcmVmaXg9e3ByZWZpeH1cbiAgICAgIC8+XG4gICAgPC9kaXY+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBUYWdTZWxlY3RvcjtcbiJdfQ== */"));
+
+var sortedTags = function sortedTags(tags, selectedTags) {
+  return tags.filter(function (_ref) {
+    var id = _ref.id;
+    return selectedTags.some(function (idSelected) {
+      return idSelected === id;
+    });
+  }).sort(function (a, b) {
+    return a.name.localeCompare(b.name, 'nb');
+  });
+};
+
+var getSuggestions = function getSuggestions(tags, inputValue) {
+  if (inputValue === '') {
+    return [];
+  }
+
+  var inputLowercase = inputValue.toLowerCase();
+  return tags.filter(function (_ref2) {
+    var name = _ref2.name;
+    return name.toLowerCase().startsWith(inputLowercase);
+  }).sort(function (a, b) {
+    return a.name.localeCompare(b.name, 'nb');
+  });
+};
+
+var TagSelector = function TagSelector(_ref3) {
+  var label = _ref3.label,
+      tags = _ref3.tags,
+      tagsSelected = _ref3.tagsSelected,
+      onCreateTag = _ref3.onCreateTag,
+      onToggleTag = _ref3.onToggleTag,
+      inline = _ref3.inline,
+      prefix = _ref3.prefix;
+
+  var _useState = (0, _react.useState)(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      inputValue = _useState2[0],
+      setInputValue = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      expanded = _useState4[0],
+      setExpanded = _useState4[1];
+
+  var _useState5 = (0, _react.useState)(DEFAULT_DROPDOWN_MAXHEIGHT),
+      _useState6 = _slicedToArray(_useState5, 2),
+      dropdownMaxHeight = _useState6[0],
+      setDropdownMaxHeight = _useState6[1];
+
+  var containerRef = (0, _react.useRef)(null);
+  var inputIdRef = (0, _react.useRef)((0, _util.uuid)());
+  (0, _react.useEffect)(function () {
+    setExpanded(false);
+  }, [tagsSelected]);
+  (0, _react.useEffect)(function () {
+    var setMaxDropdownMaxHeight = function setMaxDropdownMaxHeight() {
+      if (!inline && containerRef.current && typeof window !== 'undefined') {
+        // Calculate distance from bottom of container to bottom of viewport
+        var containerBottom = containerRef.current.getBoundingClientRect().bottom;
+        var viewportBottom = document.documentElement.scrollHeight;
+        var maxDropdownHeight = viewportBottom - containerBottom;
+        setDropdownMaxHeight("".concat(maxDropdownHeight - _core.spacingUnit, "px"));
+      }
+    };
+
+    if (!inline && typeof window !== 'undefined') {
+      if (expanded) {
+        setMaxDropdownMaxHeight();
+        window.addEventListener('resize', setMaxDropdownMaxHeight);
+      } else {
+        window.removeEventListener('resize', setMaxDropdownMaxHeight);
+      }
+    }
+
+    return function () {
+      typeof window !== 'undefined' && window.removeEventListener('resize', setMaxDropdownMaxHeight);
+    };
+  }, [expanded, inline]);
+  return (0, _core2.jsx)("div", {
+    ref: containerRef
+  }, (0, _core2.jsx)(StyledLabel, {
+    htmlFor: inputIdRef.current
+  }, label), (0, _core2.jsx)(_SuggestionInput["default"], {
+    onChange: function onChange(e) {
+      var target = e.target;
+      setInputValue(target.value);
+      setExpanded(false);
+    },
+    suggestions: expanded ? tags : getSuggestions(tags, inputValue),
+    value: inputValue,
+    onCreateTag: onCreateTag,
+    onToggleTag: onToggleTag,
+    setInputValue: setInputValue,
+    addedTags: sortedTags(tags, tagsSelected),
+    expanded: expanded,
+    setExpanded: setExpanded,
+    dropdownMaxHeight: dropdownMaxHeight,
+    inline: inline,
+    scrollAnchorElement: containerRef,
+    prefix: prefix
+  }));
+};
+
+var _default = TagSelector;
+exports["default"] = _default;

package/lib/TagSelector/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import TagSelector, { TagType } from './TagSelector';
+export type { TagType };
+export { TagSelector };

package/lib/TagSelector/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "TagSelector", {
+  enumerable: true,
+  get: function get() {
+    return _TagSelector["default"];
+  }
+});
+
+var _TagSelector = _interopRequireWildcard(require("./TagSelector"));
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/lib/TreeStructure/FolderItem.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import React from 'react';
+import { SetFocusedFolderId } from './TreeStructure.types';
+interface Props {
+    name: string;
+    id: string;
+    onToggleOpen: (id: string) => void;
+    onMarkFolder: (id: string) => void;
+    isOpen: boolean;
+    markedFolderId?: string;
+    focusedFolderId?: string;
+    loading?: boolean;
+    openOnFolderClick?: boolean;
+    hideArrow?: boolean;
+    setFocusedFolderId: SetFocusedFolderId;
+    url?: string;
+    icon?: React.ReactNode;
+    noPaddingWhenArrowIsHidden?: boolean;
+}
+declare const FolderItem: ({ hideArrow, loading, name, id, onToggleOpen, onMarkFolder, isOpen, markedFolderId, focusedFolderId, openOnFolderClick, setFocusedFolderId, icon, url, noPaddingWhenArrowIsHidden, }: Props) => JSX.Element;
+export default FolderItem;

package/lib/TreeStructure/FolderItem.js

@@ -0,0 +1,140 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _common = require("@ndla/icons/common");
+
+var _contentType = require("@ndla/icons/contentType");
+
+var _core = require("@ndla/core");
+
+var _core2 = require("@emotion/core");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+var OpenButton = (0, _styledBase["default"])("button", {
+  target: "e11ok6h80",
+  label: "OpenButton"
+})("background:transparent;border:0;transform:rotate(", function (_ref) {
+  var isOpen = _ref.isOpen;
+  return isOpen ? '0' : '-90';
+}, "deg);padding:", _core.spacing.xsmall, ";display:flex;margin:0;color:", _core.colors.brand.secondary, ";cursor:pointer;&:hover{color:", _core.colors.brand.primary, ";}svg{width:16px;height:16px;transform:", function (_ref2) {
+  var isOpen = _ref2.isOpen;
+  return isOpen ? 'translateX(3px)' : 'translateY(3px)';
+}, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlckl0ZW0udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWVxRCIsImZpbGUiOiJGb2xkZXJJdGVtLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IHVzZUVmZmVjdCwgdXNlUmVmIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgQXJyb3dEcm9wRG93biB9IGZyb20gJ0BuZGxhL2ljb25zL2NvbW1vbic7XG5pbXBvcnQgeyBGb2xkZXJPdXRsaW5lZCB9IGZyb20gJ0BuZGxhL2ljb25zL2NvbnRlbnRUeXBlJztcbmltcG9ydCB7IGNvbG9ycywgc3BhY2luZywgbWlzYywgYW5pbWF0aW9ucyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHsgU2V0Rm9jdXNlZEZvbGRlcklkIH0gZnJvbSAnLi9UcmVlU3RydWN0dXJlLnR5cGVzJztcblxuY29uc3QgT3BlbkJ1dHRvbiA9IHN0eWxlZC5idXR0b248eyBpc09wZW46IGJvb2xlYW4gfT5gXG4gIGJhY2tncm91bmQ6IHRyYW5zcGFyZW50O1xuICBib3JkZXI6IDA7XG4gIHRyYW5zZm9ybTogcm90YXRlKCR7KHsgaXNPcGVuIH0pID0+IChpc09wZW4gPyAnMCcgOiAnLTkwJyl9ZGVnKTtcbiAgcGFkZGluZzogJHtzcGFjaW5nLnhzbWFsbH07XG4gIGRpc3BsYXk6IGZsZXg7XG4gIG1hcmdpbjogMDtcbiAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnNlY29uZGFyeX07XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgJjpob3ZlciB7XG4gICAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuICB9XG4gIHN2ZyB7XG4gICAgd2lkdGg6IDE2cHg7XG4gICAgaGVpZ2h0OiAxNnB4O1xuICAgIHRyYW5zZm9ybTogJHsoeyBpc09wZW4gfSkgPT4gKGlzT3BlbiA/ICd0cmFuc2xhdGVYKDNweCknIDogJ3RyYW5zbGF0ZVkoM3B4KScpfTtcbiAgfVxuYDtcblxuY29uc3QgRm9sZGVySXRlbVdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcblxuY29uc3QgRm9sZGVyTmFtZSA9IHN0eWxlZC5idXR0b248eyBtYXJrZWQ6IGJvb2xlYW47IG5vQXJyb3c/OiBib29sZWFuIH0+YFxuICBsaW5lLWhlaWdodDogMTtcbiAgYmFja2dyb3VuZDogJHsoeyBtYXJrZWQgfSkgPT4gKG1hcmtlZCA/IGNvbG9ycy5icmFuZC5saWdodGVyIDogJ3RyYW5zcGFyZW50Jyl9O1xuICBjb2xvcjogJHtjb2xvcnMudGV4dC5wcmltYXJ5fTtcbiAgJjpob3ZlcixcbiAgJjpmb2N1cyB7XG4gICAgYmFja2dyb3VuZDogJHsoeyBtYXJrZWQgfSkgPT4gKG1hcmtlZCA/IGNvbG9ycy5icmFuZC5saWdodCA6IGNvbG9ycy5icmFuZC5saWdodGVzdCl9O1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgfVxuICB0cmFuc2l0aW9uOiAke2FuaW1hdGlvbnMuZHVyYXRpb25zLnN1cGVyRmFzdH07XG4gIGJvcmRlcjogMDtcbiAgYm9yZGVyLXJhZGl1czogJHttaXNjLmJvcmRlclJhZGl1c307XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogJHtzcGFjaW5nLnh4c21hbGx9O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIHBhZGRpbmc6ICR7c3BhY2luZy54c21hbGx9O1xuICBtYXJnaW46IDA7XG4gIG1hcmdpbi1sZWZ0OiAkeyh7IG5vQXJyb3cgfSkgPT4gKG5vQXJyb3cgPyBgMjlweGAgOiBgMHB4YCl9O1xuICBmbGV4LWdyb3c6IDE7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG5gO1xuXG5jb25zdCBGb2xkZXJOYW1lTGluayA9IEZvbGRlck5hbWUud2l0aENvbXBvbmVudCgnYScpO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBuYW1lOiBzdHJpbmc7XG4gIGlkOiBzdHJpbmc7XG4gIG9uVG9nZ2xlT3BlbjogKGlkOiBzdHJpbmcpID0+IHZvaWQ7XG4gIG9uTWFya0ZvbGRlcjogKGlkOiBzdHJpbmcpID0+IHZvaWQ7XG4gIGlzT3BlbjogYm9vbGVhbjtcbiAgbWFya2VkRm9sZGVySWQ/OiBzdHJpbmc7XG4gIGZvY3VzZWRGb2xkZXJJZD86IHN0cmluZztcbiAgbG9hZGluZz86IGJvb2xlYW47XG4gIG9wZW5PbkZvbGRlckNsaWNrPzogYm9vbGVhbjtcbiAgaGlkZUFycm93PzogYm9vbGVhbjtcbiAgc2V0Rm9jdXNlZEZvbGRlcklkOiBTZXRGb2N1c2VkRm9sZGVySWQ7XG4gIHVybD86IHN0cmluZztcbiAgaWNvbj86IFJlYWN0LlJlYWN0Tm9kZTtcbiAgbm9QYWRkaW5nV2hlbkFycm93SXNIaWRkZW4/OiBib29sZWFuO1xufVxuXG5jb25zdCBGb2xkZXJJdGVtID0gKHtcbiAgaGlkZUFycm93LFxuICBsb2FkaW5nLFxuICBuYW1lLFxuICBpZCxcbiAgb25Ub2dnbGVPcGVuLFxuICBvbk1hcmtGb2xkZXIsXG4gIGlzT3BlbixcbiAgbWFya2VkRm9sZGVySWQsXG4gIGZvY3VzZWRGb2xkZXJJZCxcbiAgb3Blbk9uRm9sZGVyQ2xpY2ssXG4gIHNldEZvY3VzZWRGb2xkZXJJZCxcbiAgaWNvbixcbiAgdXJsLFxuICBub1BhZGRpbmdXaGVuQXJyb3dJc0hpZGRlbixcbn06IFByb3BzKSA9PiB7XG4gIGNvbnN0IGZvbGRlck5hbWVMaW5rUmVmID0gdXNlUmVmPEhUTUxBbmNob3JFbGVtZW50IHwgbnVsbD4obnVsbCk7XG4gIGNvbnN0IGZvbGRlck5hbWVCdXR0b25SZWYgPSB1c2VSZWY8SFRNTEJ1dHRvbkVsZW1lbnQgfCBudWxsPihudWxsKTtcbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAoZm9jdXNlZEZvbGRlcklkID09PSBpZCkge1xuICAgICAgaWYgKHVybCAmJiBmb2xkZXJOYW1lTGlua1JlZi5jdXJyZW50KSB7XG4gICAgICAgIGZvbGRlck5hbWVMaW5rUmVmLmN1cnJlbnQuZm9jdXMoKTtcbiAgICAgIH0gZWxzZSBpZiAoZm9sZGVyTmFtZUJ1dHRvblJlZi5jdXJyZW50KSB7XG4gICAgICAgIGZvbGRlck5hbWVCdXR0b25SZWYuY3VycmVudC5mb2N1cygpO1xuICAgICAgfVxuICAgIH1cbiAgfSwgW2ZvY3VzZWRGb2xkZXJJZCwgZm9sZGVyTmFtZUxpbmtSZWYsIGZvbGRlck5hbWVCdXR0b25SZWYsIHVybCwgaWRdKTtcbiAgY29uc3QgbWFya2VkID0gbWFya2VkRm9sZGVySWQgPT09IGlkO1xuICByZXR1cm4gKFxuICAgIDxGb2xkZXJJdGVtV3JhcHBlcj5cbiAgICAgIHshaGlkZUFycm93ICYmIChcbiAgICAgICAgPE9wZW5CdXR0b24gdGFiSW5kZXg9ey0xfSBpc09wZW49e2lzT3Blbn0gZGlzYWJsZWQ9e2xvYWRpbmd9IG9uQ2xpY2s9eygpID0+IG9uVG9nZ2xlT3BlbihpZCl9PlxuICAgICAgICAgIDxBcnJvd0Ryb3BEb3duIC8+XG4gICAgICAgIDwvT3BlbkJ1dHRvbj5cbiAgICAgICl9XG4gICAgICB7dXJsID8gKFxuICAgICAgICA8Rm9sZGVyTmFtZUxpbmtcbiAgICAgICAgICByZWY9e2ZvbGRlck5hbWVMaW5rUmVmfVxuICAgICAgICAgIG5vQXJyb3c9e2hpZGVBcnJvd31cbiAgICAgICAgICB0YWJJbmRleD17bWFya2VkID8gMCA6IC0xfVxuICAgICAgICAgIG1hcmtlZD17bWFya2VkfVxuICAgICAgICAgIGhyZWY9e2xvYWRpbmcgPyB1bmRlZmluZWQgOiB1cmx9XG4gICAgICAgICAgb25Gb2N1cz17KCkgPT4ge1xuICAgICAgICAgICAgc2V0Rm9jdXNlZEZvbGRlcklkKGlkKTtcbiAgICAgICAgICB9fVxuICAgICAgICAgIG9uQ2xpY2s9eygpID0+IHtcbiAgICAgICAgICAgIG9uTWFya0ZvbGRlcihpZCk7XG4gICAgICAgICAgICBpZiAob3Blbk9uRm9sZGVyQ2xpY2spIHtcbiAgICAgICAgICAgICAgb25Ub2dnbGVPcGVuKGlkKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9fT5cbiAgICAgICAgICB7aWNvbiB8fCA8Rm9sZGVyT3V0bGluZWQgLz59XG4gICAgICAgICAge25hbWV9XG4gICAgICAgIDwvRm9sZGVyTmFtZUxpbms+XG4gICAgICApIDogKFxuICAgICAgICA8Rm9sZGVyTmFtZVxuICAgICAgICAgIHJlZj17Zm9sZGVyTmFtZUJ1dHRvblJlZn1cbiAgICAgICAgICBub0Fycm93PXtoaWRlQXJyb3cgJiYgIW5vUGFkZGluZ1doZW5BcnJvd0lzSGlkZGVufVxuICAgICAgICAgIHRhYkluZGV4PXttYXJrZWQgPyAwIDogLTF9XG4gICAgICAgICAgbWFya2VkPXttYXJrZWR9XG4gICAgICAgICAgZGlzYWJsZWQ9e2xvYWRpbmd9XG4gICAgICAgICAgb25Gb2N1cz17KCkgPT4ge1xuICAgICAgICAgICAgc2V0Rm9jdXNlZEZvbGRlcklkKGlkKTtcbiAgICAgICAgICB9fVxuICAgICAgICAgIG9uQ2xpY2s9eygpID0+IHtcbiAgICAgICAgICAgIG9uTWFya0ZvbGRlcihpZCk7XG4gICAgICAgICAgICBpZiAob3Blbk9uRm9sZGVyQ2xpY2spIHtcbiAgICAgICAgICAgICAgb25Ub2dnbGVPcGVuKGlkKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9fT5cbiAgICAgICAgICB7aWNvbiB8fCA8Rm9sZGVyT3V0bGluZWQgLz59XG4gICAgICAgICAge25hbWV9XG4gICAgICAgIDwvRm9sZGVyTmFtZT5cbiAgICAgICl9XG4gICAgPC9Gb2xkZXJJdGVtV3JhcHBlcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlckl0ZW07XG4iXX0= */"));
+var FolderItemWrapper = (0, _styledBase["default"])("div", {
+  target: "e11ok6h81",
+  label: "FolderItemWrapper"
+})(process.env.NODE_ENV === "production" ? {
+  name: "70qvj9",
+  styles: "display:flex;align-items:center;"
+} : {
+  name: "70qvj9",
+  styles: "display:flex;align-items:center;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlckl0ZW0udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtDb0MiLCJmaWxlIjoiRm9sZGVySXRlbS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZVJlZiB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IEFycm93RHJvcERvd24gfSBmcm9tICdAbmRsYS9pY29ucy9jb21tb24nO1xuaW1wb3J0IHsgRm9sZGVyT3V0bGluZWQgfSBmcm9tICdAbmRsYS9pY29ucy9jb250ZW50VHlwZSc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcsIG1pc2MsIGFuaW1hdGlvbnMgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IFNldEZvY3VzZWRGb2xkZXJJZCB9IGZyb20gJy4vVHJlZVN0cnVjdHVyZS50eXBlcyc7XG5cbmNvbnN0IE9wZW5CdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNPcGVuOiBib29sZWFuIH0+YFxuICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyOiAwO1xuICB0cmFuc2Zvcm06IHJvdGF0ZSgkeyh7IGlzT3BlbiB9KSA9PiAoaXNPcGVuID8gJzAnIDogJy05MCcpfWRlZyk7XG4gIHBhZGRpbmc6ICR7c3BhY2luZy54c21hbGx9O1xuICBkaXNwbGF5OiBmbGV4O1xuICBtYXJnaW46IDA7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5zZWNvbmRhcnl9O1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gICY6aG92ZXIge1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgfVxuICBzdmcge1xuICAgIHdpZHRoOiAxNnB4O1xuICAgIGhlaWdodDogMTZweDtcbiAgICB0cmFuc2Zvcm06ICR7KHsgaXNPcGVuIH0pID0+IChpc09wZW4gPyAndHJhbnNsYXRlWCgzcHgpJyA6ICd0cmFuc2xhdGVZKDNweCknKX07XG4gIH1cbmA7XG5cbmNvbnN0IEZvbGRlckl0ZW1XcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbmA7XG5cbmNvbnN0IEZvbGRlck5hbWUgPSBzdHlsZWQuYnV0dG9uPHsgbWFya2VkOiBib29sZWFuOyBub0Fycm93PzogYm9vbGVhbiB9PmBcbiAgbGluZS1oZWlnaHQ6IDE7XG4gIGJhY2tncm91bmQ6ICR7KHsgbWFya2VkIH0pID0+IChtYXJrZWQgPyBjb2xvcnMuYnJhbmQubGlnaHRlciA6ICd0cmFuc3BhcmVudCcpfTtcbiAgY29sb3I6ICR7Y29sb3JzLnRleHQucHJpbWFyeX07XG4gICY6aG92ZXIsXG4gICY6Zm9jdXMge1xuICAgIGJhY2tncm91bmQ6ICR7KHsgbWFya2VkIH0pID0+IChtYXJrZWQgPyBjb2xvcnMuYnJhbmQubGlnaHQgOiBjb2xvcnMuYnJhbmQubGlnaHRlc3QpfTtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gIH1cbiAgdHJhbnNpdGlvbjogJHthbmltYXRpb25zLmR1cmF0aW9ucy5zdXBlckZhc3R9O1xuICBib3JkZXI6IDA7XG4gIGJvcmRlci1yYWRpdXM6ICR7bWlzYy5ib3JkZXJSYWRpdXN9O1xuICBkaXNwbGF5OiBmbGV4O1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBwYWRkaW5nOiAke3NwYWNpbmcueHNtYWxsfTtcbiAgbWFyZ2luOiAwO1xuICBtYXJnaW4tbGVmdDogJHsoeyBub0Fycm93IH0pID0+IChub0Fycm93ID8gYDI5cHhgIDogYDBweGApfTtcbiAgZmxleC1ncm93OiAxO1xuICBib3gtc2hhZG93OiBub25lO1xuYDtcblxuY29uc3QgRm9sZGVyTmFtZUxpbmsgPSBGb2xkZXJOYW1lLndpdGhDb21wb25lbnQoJ2EnKTtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgbmFtZTogc3RyaW5nO1xuICBpZDogc3RyaW5nO1xuICBvblRvZ2dsZU9wZW46IChpZDogc3RyaW5nKSA9PiB2b2lkO1xuICBvbk1hcmtGb2xkZXI6IChpZDogc3RyaW5nKSA9PiB2b2lkO1xuICBpc09wZW46IGJvb2xlYW47XG4gIG1hcmtlZEZvbGRlcklkPzogc3RyaW5nO1xuICBmb2N1c2VkRm9sZGVySWQ/OiBzdHJpbmc7XG4gIGxvYWRpbmc/OiBib29sZWFuO1xuICBvcGVuT25Gb2xkZXJDbGljaz86IGJvb2xlYW47XG4gIGhpZGVBcnJvdz86IGJvb2xlYW47XG4gIHNldEZvY3VzZWRGb2xkZXJJZDogU2V0Rm9jdXNlZEZvbGRlcklkO1xuICB1cmw/OiBzdHJpbmc7XG4gIGljb24/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIG5vUGFkZGluZ1doZW5BcnJvd0lzSGlkZGVuPzogYm9vbGVhbjtcbn1cblxuY29uc3QgRm9sZGVySXRlbSA9ICh7XG4gIGhpZGVBcnJvdyxcbiAgbG9hZGluZyxcbiAgbmFtZSxcbiAgaWQsXG4gIG9uVG9nZ2xlT3BlbixcbiAgb25NYXJrRm9sZGVyLFxuICBpc09wZW4sXG4gIG1hcmtlZEZvbGRlcklkLFxuICBmb2N1c2VkRm9sZGVySWQsXG4gIG9wZW5PbkZvbGRlckNsaWNrLFxuICBzZXRGb2N1c2VkRm9sZGVySWQsXG4gIGljb24sXG4gIHVybCxcbiAgbm9QYWRkaW5nV2hlbkFycm93SXNIaWRkZW4sXG59OiBQcm9wcykgPT4ge1xuICBjb25zdCBmb2xkZXJOYW1lTGlua1JlZiA9IHVzZVJlZjxIVE1MQW5jaG9yRWxlbWVudCB8IG51bGw+KG51bGwpO1xuICBjb25zdCBmb2xkZXJOYW1lQnV0dG9uUmVmID0gdXNlUmVmPEhUTUxCdXR0b25FbGVtZW50IHwgbnVsbD4obnVsbCk7XG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGZvY3VzZWRGb2xkZXJJZCA9PT0gaWQpIHtcbiAgICAgIGlmICh1cmwgJiYgZm9sZGVyTmFtZUxpbmtSZWYuY3VycmVudCkge1xuICAgICAgICBmb2xkZXJOYW1lTGlua1JlZi5jdXJyZW50LmZvY3VzKCk7XG4gICAgICB9IGVsc2UgaWYgKGZvbGRlck5hbWVCdXR0b25SZWYuY3VycmVudCkge1xuICAgICAgICBmb2xkZXJOYW1lQnV0dG9uUmVmLmN1cnJlbnQuZm9jdXMoKTtcbiAgICAgIH1cbiAgICB9XG4gIH0sIFtmb2N1c2VkRm9sZGVySWQsIGZvbGRlck5hbWVMaW5rUmVmLCBmb2xkZXJOYW1lQnV0dG9uUmVmLCB1cmwsIGlkXSk7XG4gIGNvbnN0IG1hcmtlZCA9IG1hcmtlZEZvbGRlcklkID09PSBpZDtcbiAgcmV0dXJuIChcbiAgICA8Rm9sZGVySXRlbVdyYXBwZXI+XG4gICAgICB7IWhpZGVBcnJvdyAmJiAoXG4gICAgICAgIDxPcGVuQnV0dG9uIHRhYkluZGV4PXstMX0gaXNPcGVuPXtpc09wZW59IGRpc2FibGVkPXtsb2FkaW5nfSBvbkNsaWNrPXsoKSA9PiBvblRvZ2dsZU9wZW4oaWQpfT5cbiAgICAgICAgICA8QXJyb3dEcm9wRG93biAvPlxuICAgICAgICA8L09wZW5CdXR0b24+XG4gICAgICApfVxuICAgICAge3VybCA/IChcbiAgICAgICAgPEZvbGRlck5hbWVMaW5rXG4gICAgICAgICAgcmVmPXtmb2xkZXJOYW1lTGlua1JlZn1cbiAgICAgICAgICBub0Fycm93PXtoaWRlQXJyb3d9XG4gICAgICAgICAgdGFiSW5kZXg9e21hcmtlZCA/IDAgOiAtMX1cbiAgICAgICAgICBtYXJrZWQ9e21hcmtlZH1cbiAgICAgICAgICBocmVmPXtsb2FkaW5nID8gdW5kZWZpbmVkIDogdXJsfVxuICAgICAgICAgIG9uRm9jdXM9eygpID0+IHtcbiAgICAgICAgICAgIHNldEZvY3VzZWRGb2xkZXJJZChpZCk7XG4gICAgICAgICAgfX1cbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICBvbk1hcmtGb2xkZXIoaWQpO1xuICAgICAgICAgICAgaWYgKG9wZW5PbkZvbGRlckNsaWNrKSB7XG4gICAgICAgICAgICAgIG9uVG9nZ2xlT3BlbihpZCk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfX0+XG4gICAgICAgICAge2ljb24gfHwgPEZvbGRlck91dGxpbmVkIC8+fVxuICAgICAgICAgIHtuYW1lfVxuICAgICAgICA8L0ZvbGRlck5hbWVMaW5rPlxuICAgICAgKSA6IChcbiAgICAgICAgPEZvbGRlck5hbWVcbiAgICAgICAgICByZWY9e2ZvbGRlck5hbWVCdXR0b25SZWZ9XG4gICAgICAgICAgbm9BcnJvdz17aGlkZUFycm93ICYmICFub1BhZGRpbmdXaGVuQXJyb3dJc0hpZGRlbn1cbiAgICAgICAgICB0YWJJbmRleD17bWFya2VkID8gMCA6IC0xfVxuICAgICAgICAgIG1hcmtlZD17bWFya2VkfVxuICAgICAgICAgIGRpc2FibGVkPXtsb2FkaW5nfVxuICAgICAgICAgIG9uRm9jdXM9eygpID0+IHtcbiAgICAgICAgICAgIHNldEZvY3VzZWRGb2xkZXJJZChpZCk7XG4gICAgICAgICAgfX1cbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICBvbk1hcmtGb2xkZXIoaWQpO1xuICAgICAgICAgICAgaWYgKG9wZW5PbkZvbGRlckNsaWNrKSB7XG4gICAgICAgICAgICAgIG9uVG9nZ2xlT3BlbihpZCk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfX0+XG4gICAgICAgICAge2ljb24gfHwgPEZvbGRlck91dGxpbmVkIC8+fVxuICAgICAgICAgIHtuYW1lfVxuICAgICAgICA8L0ZvbGRlck5hbWU+XG4gICAgICApfVxuICAgIDwvRm9sZGVySXRlbVdyYXBwZXI+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBGb2xkZXJJdGVtO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var FolderName = (0, _styledBase["default"])("button", {
+  target: "e11ok6h82",
+  label: "FolderName"
+})("line-height:1;background:", function (_ref3) {
+  var marked = _ref3.marked;
+  return marked ? _core.colors.brand.lighter : 'transparent';
+}, ";color:", _core.colors.text.primary, ";&:hover,&:focus{background:", function (_ref4) {
+  var marked = _ref4.marked;
+  return marked ? _core.colors.brand.light : _core.colors.brand.lightest;
+}, ";color:", _core.colors.brand.primary, ";}transition:", _core.animations.durations.superFast, ";border:0;border-radius:", _core.misc.borderRadius, ";display:flex;gap:", _core.spacing.xxsmall, ";align-items:center;cursor:pointer;padding:", _core.spacing.xsmall, ";margin:0;margin-left:", function (_ref5) {
+  var noArrow = _ref5.noArrow;
+  return noArrow ? "29px" : "0px";
+}, ";flex-grow:1;box-shadow:none;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlckl0ZW0udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVDd0UiLCJmaWxlIjoiRm9sZGVySXRlbS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZVJlZiB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IEFycm93RHJvcERvd24gfSBmcm9tICdAbmRsYS9pY29ucy9jb21tb24nO1xuaW1wb3J0IHsgRm9sZGVyT3V0bGluZWQgfSBmcm9tICdAbmRsYS9pY29ucy9jb250ZW50VHlwZSc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcsIG1pc2MsIGFuaW1hdGlvbnMgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IFNldEZvY3VzZWRGb2xkZXJJZCB9IGZyb20gJy4vVHJlZVN0cnVjdHVyZS50eXBlcyc7XG5cbmNvbnN0IE9wZW5CdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNPcGVuOiBib29sZWFuIH0+YFxuICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyOiAwO1xuICB0cmFuc2Zvcm06IHJvdGF0ZSgkeyh7IGlzT3BlbiB9KSA9PiAoaXNPcGVuID8gJzAnIDogJy05MCcpfWRlZyk7XG4gIHBhZGRpbmc6ICR7c3BhY2luZy54c21hbGx9O1xuICBkaXNwbGF5OiBmbGV4O1xuICBtYXJnaW46IDA7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5zZWNvbmRhcnl9O1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gICY6aG92ZXIge1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgfVxuICBzdmcge1xuICAgIHdpZHRoOiAxNnB4O1xuICAgIGhlaWdodDogMTZweDtcbiAgICB0cmFuc2Zvcm06ICR7KHsgaXNPcGVuIH0pID0+IChpc09wZW4gPyAndHJhbnNsYXRlWCgzcHgpJyA6ICd0cmFuc2xhdGVZKDNweCknKX07XG4gIH1cbmA7XG5cbmNvbnN0IEZvbGRlckl0ZW1XcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbmA7XG5cbmNvbnN0IEZvbGRlck5hbWUgPSBzdHlsZWQuYnV0dG9uPHsgbWFya2VkOiBib29sZWFuOyBub0Fycm93PzogYm9vbGVhbiB9PmBcbiAgbGluZS1oZWlnaHQ6IDE7XG4gIGJhY2tncm91bmQ6ICR7KHsgbWFya2VkIH0pID0+IChtYXJrZWQgPyBjb2xvcnMuYnJhbmQubGlnaHRlciA6ICd0cmFuc3BhcmVudCcpfTtcbiAgY29sb3I6ICR7Y29sb3JzLnRleHQucHJpbWFyeX07XG4gICY6aG92ZXIsXG4gICY6Zm9jdXMge1xuICAgIGJhY2tncm91bmQ6ICR7KHsgbWFya2VkIH0pID0+IChtYXJrZWQgPyBjb2xvcnMuYnJhbmQubGlnaHQgOiBjb2xvcnMuYnJhbmQubGlnaHRlc3QpfTtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gIH1cbiAgdHJhbnNpdGlvbjogJHthbmltYXRpb25zLmR1cmF0aW9ucy5zdXBlckZhc3R9O1xuICBib3JkZXI6IDA7XG4gIGJvcmRlci1yYWRpdXM6ICR7bWlzYy5ib3JkZXJSYWRpdXN9O1xuICBkaXNwbGF5OiBmbGV4O1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBwYWRkaW5nOiAke3NwYWNpbmcueHNtYWxsfTtcbiAgbWFyZ2luOiAwO1xuICBtYXJnaW4tbGVmdDogJHsoeyBub0Fycm93IH0pID0+IChub0Fycm93ID8gYDI5cHhgIDogYDBweGApfTtcbiAgZmxleC1ncm93OiAxO1xuICBib3gtc2hhZG93OiBub25lO1xuYDtcblxuY29uc3QgRm9sZGVyTmFtZUxpbmsgPSBGb2xkZXJOYW1lLndpdGhDb21wb25lbnQoJ2EnKTtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgbmFtZTogc3RyaW5nO1xuICBpZDogc3RyaW5nO1xuICBvblRvZ2dsZU9wZW46IChpZDogc3RyaW5nKSA9PiB2b2lkO1xuICBvbk1hcmtGb2xkZXI6IChpZDogc3RyaW5nKSA9PiB2b2lkO1xuICBpc09wZW46IGJvb2xlYW47XG4gIG1hcmtlZEZvbGRlcklkPzogc3RyaW5nO1xuICBmb2N1c2VkRm9sZGVySWQ/OiBzdHJpbmc7XG4gIGxvYWRpbmc/OiBib29sZWFuO1xuICBvcGVuT25Gb2xkZXJDbGljaz86IGJvb2xlYW47XG4gIGhpZGVBcnJvdz86IGJvb2xlYW47XG4gIHNldEZvY3VzZWRGb2xkZXJJZDogU2V0Rm9jdXNlZEZvbGRlcklkO1xuICB1cmw/OiBzdHJpbmc7XG4gIGljb24/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIG5vUGFkZGluZ1doZW5BcnJvd0lzSGlkZGVuPzogYm9vbGVhbjtcbn1cblxuY29uc3QgRm9sZGVySXRlbSA9ICh7XG4gIGhpZGVBcnJvdyxcbiAgbG9hZGluZyxcbiAgbmFtZSxcbiAgaWQsXG4gIG9uVG9nZ2xlT3BlbixcbiAgb25NYXJrRm9sZGVyLFxuICBpc09wZW4sXG4gIG1hcmtlZEZvbGRlcklkLFxuICBmb2N1c2VkRm9sZGVySWQsXG4gIG9wZW5PbkZvbGRlckNsaWNrLFxuICBzZXRGb2N1c2VkRm9sZGVySWQsXG4gIGljb24sXG4gIHVybCxcbiAgbm9QYWRkaW5nV2hlbkFycm93SXNIaWRkZW4sXG59OiBQcm9wcykgPT4ge1xuICBjb25zdCBmb2xkZXJOYW1lTGlua1JlZiA9IHVzZVJlZjxIVE1MQW5jaG9yRWxlbWVudCB8IG51bGw+KG51bGwpO1xuICBjb25zdCBmb2xkZXJOYW1lQnV0dG9uUmVmID0gdXNlUmVmPEhUTUxCdXR0b25FbGVtZW50IHwgbnVsbD4obnVsbCk7XG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGZvY3VzZWRGb2xkZXJJZCA9PT0gaWQpIHtcbiAgICAgIGlmICh1cmwgJiYgZm9sZGVyTmFtZUxpbmtSZWYuY3VycmVudCkge1xuICAgICAgICBmb2xkZXJOYW1lTGlua1JlZi5jdXJyZW50LmZvY3VzKCk7XG4gICAgICB9IGVsc2UgaWYgKGZvbGRlck5hbWVCdXR0b25SZWYuY3VycmVudCkge1xuICAgICAgICBmb2xkZXJOYW1lQnV0dG9uUmVmLmN1cnJlbnQuZm9jdXMoKTtcbiAgICAgIH1cbiAgICB9XG4gIH0sIFtmb2N1c2VkRm9sZGVySWQsIGZvbGRlck5hbWVMaW5rUmVmLCBmb2xkZXJOYW1lQnV0dG9uUmVmLCB1cmwsIGlkXSk7XG4gIGNvbnN0IG1hcmtlZCA9IG1hcmtlZEZvbGRlcklkID09PSBpZDtcbiAgcmV0dXJuIChcbiAgICA8Rm9sZGVySXRlbVdyYXBwZXI+XG4gICAgICB7IWhpZGVBcnJvdyAmJiAoXG4gICAgICAgIDxPcGVuQnV0dG9uIHRhYkluZGV4PXstMX0gaXNPcGVuPXtpc09wZW59IGRpc2FibGVkPXtsb2FkaW5nfSBvbkNsaWNrPXsoKSA9PiBvblRvZ2dsZU9wZW4oaWQpfT5cbiAgICAgICAgICA8QXJyb3dEcm9wRG93biAvPlxuICAgICAgICA8L09wZW5CdXR0b24+XG4gICAgICApfVxuICAgICAge3VybCA/IChcbiAgICAgICAgPEZvbGRlck5hbWVMaW5rXG4gICAgICAgICAgcmVmPXtmb2xkZXJOYW1lTGlua1JlZn1cbiAgICAgICAgICBub0Fycm93PXtoaWRlQXJyb3d9XG4gICAgICAgICAgdGFiSW5kZXg9e21hcmtlZCA/IDAgOiAtMX1cbiAgICAgICAgICBtYXJrZWQ9e21hcmtlZH1cbiAgICAgICAgICBocmVmPXtsb2FkaW5nID8gdW5kZWZpbmVkIDogdXJsfVxuICAgICAgICAgIG9uRm9jdXM9eygpID0+IHtcbiAgICAgICAgICAgIHNldEZvY3VzZWRGb2xkZXJJZChpZCk7XG4gICAgICAgICAgfX1cbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICBvbk1hcmtGb2xkZXIoaWQpO1xuICAgICAgICAgICAgaWYgKG9wZW5PbkZvbGRlckNsaWNrKSB7XG4gICAgICAgICAgICAgIG9uVG9nZ2xlT3BlbihpZCk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfX0+XG4gICAgICAgICAge2ljb24gfHwgPEZvbGRlck91dGxpbmVkIC8+fVxuICAgICAgICAgIHtuYW1lfVxuICAgICAgICA8L0ZvbGRlck5hbWVMaW5rPlxuICAgICAgKSA6IChcbiAgICAgICAgPEZvbGRlck5hbWVcbiAgICAgICAgICByZWY9e2ZvbGRlck5hbWVCdXR0b25SZWZ9XG4gICAgICAgICAgbm9BcnJvdz17aGlkZUFycm93ICYmICFub1BhZGRpbmdXaGVuQXJyb3dJc0hpZGRlbn1cbiAgICAgICAgICB0YWJJbmRleD17bWFya2VkID8gMCA6IC0xfVxuICAgICAgICAgIG1hcmtlZD17bWFya2VkfVxuICAgICAgICAgIGRpc2FibGVkPXtsb2FkaW5nfVxuICAgICAgICAgIG9uRm9jdXM9eygpID0+IHtcbiAgICAgICAgICAgIHNldEZvY3VzZWRGb2xkZXJJZChpZCk7XG4gICAgICAgICAgfX1cbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICBvbk1hcmtGb2xkZXIoaWQpO1xuICAgICAgICAgICAgaWYgKG9wZW5PbkZvbGRlckNsaWNrKSB7XG4gICAgICAgICAgICAgIG9uVG9nZ2xlT3BlbihpZCk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfX0+XG4gICAgICAgICAge2ljb24gfHwgPEZvbGRlck91dGxpbmVkIC8+fVxuICAgICAgICAgIHtuYW1lfVxuICAgICAgICA8L0ZvbGRlck5hbWU+XG4gICAgICApfVxuICAgIDwvRm9sZGVySXRlbVdyYXBwZXI+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBGb2xkZXJJdGVtO1xuIl19 */"));
+var FolderNameLink = FolderName.withComponent('a', {
+  target: "e11ok6h83",
+  label: "FolderNameLink"
+});
+
+var FolderItem = function FolderItem(_ref6) {
+  var hideArrow = _ref6.hideArrow,
+      loading = _ref6.loading,
+      name = _ref6.name,
+      id = _ref6.id,
+      onToggleOpen = _ref6.onToggleOpen,
+      onMarkFolder = _ref6.onMarkFolder,
+      isOpen = _ref6.isOpen,
+      markedFolderId = _ref6.markedFolderId,
+      focusedFolderId = _ref6.focusedFolderId,
+      openOnFolderClick = _ref6.openOnFolderClick,
+      setFocusedFolderId = _ref6.setFocusedFolderId,
+      icon = _ref6.icon,
+      url = _ref6.url,
+      noPaddingWhenArrowIsHidden = _ref6.noPaddingWhenArrowIsHidden;
+  var folderNameLinkRef = (0, _react.useRef)(null);
+  var folderNameButtonRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    if (focusedFolderId === id) {
+      if (url && folderNameLinkRef.current) {
+        folderNameLinkRef.current.focus();
+      } else if (folderNameButtonRef.current) {
+        folderNameButtonRef.current.focus();
+      }
+    }
+  }, [focusedFolderId, folderNameLinkRef, folderNameButtonRef, url, id]);
+  var marked = markedFolderId === id;
+  return (0, _core2.jsx)(FolderItemWrapper, null, !hideArrow && (0, _core2.jsx)(OpenButton, {
+    tabIndex: -1,
+    isOpen: isOpen,
+    disabled: loading,
+    onClick: function onClick() {
+      return onToggleOpen(id);
+    }
+  }, (0, _core2.jsx)(_common.ArrowDropDown, null)), url ? (0, _core2.jsx)(FolderNameLink, {
+    ref: folderNameLinkRef,
+    noArrow: hideArrow,
+    tabIndex: marked ? 0 : -1,
+    marked: marked,
+    href: loading ? undefined : url,
+    onFocus: function onFocus() {
+      setFocusedFolderId(id);
+    },
+    onClick: function onClick() {
+      onMarkFolder(id);
+
+      if (openOnFolderClick) {
+        onToggleOpen(id);
+      }
+    }
+  }, icon || (0, _core2.jsx)(_contentType.FolderOutlined, null), name) : (0, _core2.jsx)(FolderName, {
+    ref: folderNameButtonRef,
+    noArrow: hideArrow && !noPaddingWhenArrowIsHidden,
+    tabIndex: marked ? 0 : -1,
+    marked: marked,
+    disabled: loading,
+    onFocus: function onFocus() {
+      setFocusedFolderId(id);
+    },
+    onClick: function onClick() {
+      onMarkFolder(id);
+
+      if (openOnFolderClick) {
+        onToggleOpen(id);
+      }
+    }
+  }, icon || (0, _core2.jsx)(_contentType.FolderOutlined, null), name));
+};
+
+var _default = FolderItem;
+exports["default"] = _default;

package/lib/TreeStructure/FolderItems.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+/// <reference types="react" />
+import { FolderItemsProps } from './TreeStructure.types';
+declare const FolderItems: ({ loading, data, idPaths, editable, onToggleOpen, onCreateNewFolder, onCancelNewFolder, onSaveNewFolder, newFolder, openFolders, markedFolderId, onMarkFolder, openOnFolderClick, focusedFolderId, setFocusedFolderId, firstLevel, }: FolderItemsProps) => JSX.Element;
+export default FolderItems;

package/lib/TreeStructure/FolderItems.js

@@ -0,0 +1,130 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@ndla/core");
+
+var _FolderItem = _interopRequireDefault(require("./FolderItem"));
+
+var _FolderNameInput = _interopRequireDefault(require("./FolderNameInput"));
+
+var _TreeStructure = require("./TreeStructure");
+
+var _core2 = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+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 _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+var StyledUL = (0, _styledBase["default"])("ul", {
+  target: "ef48q150",
+  label: "StyledUL"
+})(_core.animations.fadeInLeft(_core.animations.durations.fast), ";animation-fill-mode:forwards;@media (prefers-reduced-motion:reduce){animation:none;}list-style:none;margin:0;padding:0;margin-left:", function (_ref) {
+  var firstLevel = _ref.firstLevel;
+  return firstLevel ? "-".concat(_core.spacing.xsmall) : _core.spacing.normal;
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlckl0ZW1zLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQm9EIiwiZmlsZSI6IkZvbGRlckl0ZW1zLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGFuaW1hdGlvbnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCBGb2xkZXJJdGVtIGZyb20gJy4vRm9sZGVySXRlbSc7XG5pbXBvcnQgRm9sZGVyTmFtZUlucHV0IGZyb20gJy4vRm9sZGVyTmFtZUlucHV0JztcbmltcG9ydCB7IEZvbGRlckl0ZW1zUHJvcHMgfSBmcm9tICcuL1RyZWVTdHJ1Y3R1cmUudHlwZXMnO1xuaW1wb3J0IHsgTUFYX0xFVkVMX0ZPUl9GT0xERVJTIH0gZnJvbSAnLi9UcmVlU3RydWN0dXJlJztcblxuY29uc3QgU3R5bGVkVUwgPSBzdHlsZWQudWw8eyBmaXJzdExldmVsPzogYm9vbGVhbiB9PmBcbiAgJHthbmltYXRpb25zLmZhZGVJbkxlZnQoYW5pbWF0aW9ucy5kdXJhdGlvbnMuZmFzdCl9O1xuICBhbmltYXRpb24tZmlsbC1tb2RlOiBmb3J3YXJkcztcbiAgQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgICBhbmltYXRpb246IG5vbmU7XG4gIH1cbiAgbGlzdC1zdHlsZTogbm9uZTtcbiAgbWFyZ2luOiAwO1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW4tbGVmdDogJHsoeyBmaXJzdExldmVsIH0pID0+IChmaXJzdExldmVsID8gYC0ke3NwYWNpbmcueHNtYWxsfWAgOiBzcGFjaW5nLm5vcm1hbCl9O1xuYDtcblxuY29uc3QgU3R5bGVkTEkgPSBzdHlsZWQubGlgXG4gIG1hcmdpbjogMDtcbiAgcGFkZGluZzogMDtcbmA7XG5cbmNvbnN0IEZvbGRlckl0ZW1zID0gKHtcbiAgbG9hZGluZyxcbiAgZGF0YSxcbiAgaWRQYXRocyxcbiAgZWRpdGFibGUsXG4gIG9uVG9nZ2xlT3BlbixcbiAgb25DcmVhdGVOZXdGb2xkZXIsXG4gIG9uQ2FuY2VsTmV3Rm9sZGVyLFxuICBvblNhdmVOZXdGb2xkZXIsXG4gIG5ld0ZvbGRlcixcbiAgb3BlbkZvbGRlcnMsXG4gIG1hcmtlZEZvbGRlcklkLFxuICBvbk1hcmtGb2xkZXIsXG4gIG9wZW5PbkZvbGRlckNsaWNrLFxuICBmb2N1c2VkRm9sZGVySWQsXG4gIHNldEZvY3VzZWRGb2xkZXJJZCxcbiAgZmlyc3RMZXZlbCxcbn06IEZvbGRlckl0ZW1zUHJvcHMpID0+IChcbiAgPFN0eWxlZFVMIHJvbGU9XCJncm91cFwiIGZpcnN0TGV2ZWw9e2ZpcnN0TGV2ZWx9PlxuICAgIHtkYXRhLm1hcCgoeyBuYW1lLCBkYXRhOiBkYXRhQ2hpbGRyZW4sIGlkLCB1cmwsIGljb24gfSwgX2luZGV4KSA9PiB7XG4gICAgICBjb25zdCBuZXdJZFBhdGhzID0gWy4uLmlkUGF0aHMsIF9pbmRleF07XG4gICAgICBjb25zdCBpc09wZW4gPSBvcGVuRm9sZGVycz8uaGFzKGlkKTtcbiAgICAgIHJldHVybiAoXG4gICAgICAgIDxTdHlsZWRMSSBrZXk9e2lkfSByb2xlPVwidHJlZWl0ZW1cIj5cbiAgICAgICAgICA8ZGl2PlxuICAgICAgICAgICAgPEZvbGRlckl0ZW1cbiAgICAgICAgICAgICAgaWNvbj17aWNvbn1cbiAgICAgICAgICAgICAgdXJsPXt1cmx9XG4gICAgICAgICAgICAgIG9wZW5PbkZvbGRlckNsaWNrPXtvcGVuT25Gb2xkZXJDbGlja31cbiAgICAgICAgICAgICAgbG9hZGluZz17bG9hZGluZ31cbiAgICAgICAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgICAgICAgIGlkPXtpZH1cbiAgICAgICAgICAgICAgbmFtZT17bmFtZX1cbiAgICAgICAgICAgICAgbWFya2VkRm9sZGVySWQ9e21hcmtlZEZvbGRlcklkfVxuICAgICAgICAgICAgICBmb2N1c2VkRm9sZGVySWQ9e2ZvY3VzZWRGb2xkZXJJZH1cbiAgICAgICAgICAgICAgb25Ub2dnbGVPcGVuPXtvblRvZ2dsZU9wZW59XG4gICAgICAgICAgICAgIG9uTWFya0ZvbGRlcj17b25NYXJrRm9sZGVyfVxuICAgICAgICAgICAgICBoaWRlQXJyb3c9e2RhdGFDaGlsZHJlbj8ubGVuZ3RoID09PSAwIHx8IG5ld0lkUGF0aHMubGVuZ3RoID49IE1BWF9MRVZFTF9GT1JfRk9MREVSU31cbiAgICAgICAgICAgICAgbm9QYWRkaW5nV2hlbkFycm93SXNIaWRkZW49e2VkaXRhYmxlICYmIGZpcnN0TGV2ZWwgJiYgZGF0YUNoaWxkcmVuPy5sZW5ndGggPT09IDB9XG4gICAgICAgICAgICAgIHNldEZvY3VzZWRGb2xkZXJJZD17c2V0Rm9jdXNlZEZvbGRlcklkfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICB7bmV3Rm9sZGVyPy5wYXJlbnRJZCA9PT0gaWQgJiYgKFxuICAgICAgICAgICAgPEZvbGRlck5hbWVJbnB1dFxuICAgICAgICAgICAgICBsb2FkaW5nPXtsb2FkaW5nfVxuICAgICAgICAgICAgICBvbkNhbmNlbE5ld0ZvbGRlcj17b25DYW5jZWxOZXdGb2xkZXJ9XG4gICAgICAgICAgICAgIG9uU2F2ZU5ld0ZvbGRlcj17b25TYXZlTmV3Rm9sZGVyfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICApfVxuICAgICAgICAgIHtkYXRhQ2hpbGRyZW4gJiYgaXNPcGVuICYmIChcbiAgICAgICAgICAgIDxGb2xkZXJJdGVtc1xuICAgICAgICAgICAgICBsb2FkaW5nPXtsb2FkaW5nfVxuICAgICAgICAgICAgICBuZXdGb2xkZXI9e25ld0ZvbGRlcn1cbiAgICAgICAgICAgICAgb3BlbkZvbGRlcnM9e29wZW5Gb2xkZXJzfVxuICAgICAgICAgICAgICBpZFBhdGhzPXtuZXdJZFBhdGhzfVxuICAgICAgICAgICAgICBlZGl0YWJsZT17ZWRpdGFibGV9XG4gICAgICAgICAgICAgIGRhdGE9e2RhdGFDaGlsZHJlbn1cbiAgICAgICAgICAgICAgb25Ub2dnbGVPcGVuPXtvblRvZ2dsZU9wZW59XG4gICAgICAgICAgICAgIG9uQ3JlYXRlTmV3Rm9sZGVyPXtvbkNyZWF0ZU5ld0ZvbGRlcn1cbiAgICAgICAgICAgICAgb25TYXZlTmV3Rm9sZGVyPXtvblNhdmVOZXdGb2xkZXJ9XG4gICAgICAgICAgICAgIG9uQ2FuY2VsTmV3Rm9sZGVyPXtvbkNhbmNlbE5ld0ZvbGRlcn1cbiAgICAgICAgICAgICAgbWFya2VkRm9sZGVySWQ9e21hcmtlZEZvbGRlcklkfVxuICAgICAgICAgICAgICBvbk1hcmtGb2xkZXI9e29uTWFya0ZvbGRlcn1cbiAgICAgICAgICAgICAgb3Blbk9uRm9sZGVyQ2xpY2s9e29wZW5PbkZvbGRlckNsaWNrfVxuICAgICAgICAgICAgICBmb2N1c2VkRm9sZGVySWQ9e2ZvY3VzZWRGb2xkZXJJZH1cbiAgICAgICAgICAgICAgc2V0Rm9jdXNlZEZvbGRlcklkPXtzZXRGb2N1c2VkRm9sZGVySWR9XG4gICAgICAgICAgICAgIGZpcnN0TGV2ZWw9e2ZhbHNlfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICApfVxuICAgICAgICA8L1N0eWxlZExJPlxuICAgICAgKTtcbiAgICB9KX1cbiAgPC9TdHlsZWRVTD5cbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlckl0ZW1zO1xuIl19 */"));
+var StyledLI = (0, _styledBase["default"])("li", {
+  target: "ef48q151",
+  label: "StyledLI"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1l95nvm",
+  styles: "margin:0;padding:0;"
+} : {
+  name: "1l95nvm",
+  styles: "margin:0;padding:0;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvbGRlckl0ZW1zLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0QjBCIiwiZmlsZSI6IkZvbGRlckl0ZW1zLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGFuaW1hdGlvbnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCBGb2xkZXJJdGVtIGZyb20gJy4vRm9sZGVySXRlbSc7XG5pbXBvcnQgRm9sZGVyTmFtZUlucHV0IGZyb20gJy4vRm9sZGVyTmFtZUlucHV0JztcbmltcG9ydCB7IEZvbGRlckl0ZW1zUHJvcHMgfSBmcm9tICcuL1RyZWVTdHJ1Y3R1cmUudHlwZXMnO1xuaW1wb3J0IHsgTUFYX0xFVkVMX0ZPUl9GT0xERVJTIH0gZnJvbSAnLi9UcmVlU3RydWN0dXJlJztcblxuY29uc3QgU3R5bGVkVUwgPSBzdHlsZWQudWw8eyBmaXJzdExldmVsPzogYm9vbGVhbiB9PmBcbiAgJHthbmltYXRpb25zLmZhZGVJbkxlZnQoYW5pbWF0aW9ucy5kdXJhdGlvbnMuZmFzdCl9O1xuICBhbmltYXRpb24tZmlsbC1tb2RlOiBmb3J3YXJkcztcbiAgQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgICBhbmltYXRpb246IG5vbmU7XG4gIH1cbiAgbGlzdC1zdHlsZTogbm9uZTtcbiAgbWFyZ2luOiAwO1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW4tbGVmdDogJHsoeyBmaXJzdExldmVsIH0pID0+IChmaXJzdExldmVsID8gYC0ke3NwYWNpbmcueHNtYWxsfWAgOiBzcGFjaW5nLm5vcm1hbCl9O1xuYDtcblxuY29uc3QgU3R5bGVkTEkgPSBzdHlsZWQubGlgXG4gIG1hcmdpbjogMDtcbiAgcGFkZGluZzogMDtcbmA7XG5cbmNvbnN0IEZvbGRlckl0ZW1zID0gKHtcbiAgbG9hZGluZyxcbiAgZGF0YSxcbiAgaWRQYXRocyxcbiAgZWRpdGFibGUsXG4gIG9uVG9nZ2xlT3BlbixcbiAgb25DcmVhdGVOZXdGb2xkZXIsXG4gIG9uQ2FuY2VsTmV3Rm9sZGVyLFxuICBvblNhdmVOZXdGb2xkZXIsXG4gIG5ld0ZvbGRlcixcbiAgb3BlbkZvbGRlcnMsXG4gIG1hcmtlZEZvbGRlcklkLFxuICBvbk1hcmtGb2xkZXIsXG4gIG9wZW5PbkZvbGRlckNsaWNrLFxuICBmb2N1c2VkRm9sZGVySWQsXG4gIHNldEZvY3VzZWRGb2xkZXJJZCxcbiAgZmlyc3RMZXZlbCxcbn06IEZvbGRlckl0ZW1zUHJvcHMpID0+IChcbiAgPFN0eWxlZFVMIHJvbGU9XCJncm91cFwiIGZpcnN0TGV2ZWw9e2ZpcnN0TGV2ZWx9PlxuICAgIHtkYXRhLm1hcCgoeyBuYW1lLCBkYXRhOiBkYXRhQ2hpbGRyZW4sIGlkLCB1cmwsIGljb24gfSwgX2luZGV4KSA9PiB7XG4gICAgICBjb25zdCBuZXdJZFBhdGhzID0gWy4uLmlkUGF0aHMsIF9pbmRleF07XG4gICAgICBjb25zdCBpc09wZW4gPSBvcGVuRm9sZGVycz8uaGFzKGlkKTtcbiAgICAgIHJldHVybiAoXG4gICAgICAgIDxTdHlsZWRMSSBrZXk9e2lkfSByb2xlPVwidHJlZWl0ZW1cIj5cbiAgICAgICAgICA8ZGl2PlxuICAgICAgICAgICAgPEZvbGRlckl0ZW1cbiAgICAgICAgICAgICAgaWNvbj17aWNvbn1cbiAgICAgICAgICAgICAgdXJsPXt1cmx9XG4gICAgICAgICAgICAgIG9wZW5PbkZvbGRlckNsaWNrPXtvcGVuT25Gb2xkZXJDbGlja31cbiAgICAgICAgICAgICAgbG9hZGluZz17bG9hZGluZ31cbiAgICAgICAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgICAgICAgIGlkPXtpZH1cbiAgICAgICAgICAgICAgbmFtZT17bmFtZX1cbiAgICAgICAgICAgICAgbWFya2VkRm9sZGVySWQ9e21hcmtlZEZvbGRlcklkfVxuICAgICAgICAgICAgICBmb2N1c2VkRm9sZGVySWQ9e2ZvY3VzZWRGb2xkZXJJZH1cbiAgICAgICAgICAgICAgb25Ub2dnbGVPcGVuPXtvblRvZ2dsZU9wZW59XG4gICAgICAgICAgICAgIG9uTWFya0ZvbGRlcj17b25NYXJrRm9sZGVyfVxuICAgICAgICAgICAgICBoaWRlQXJyb3c9e2RhdGFDaGlsZHJlbj8ubGVuZ3RoID09PSAwIHx8IG5ld0lkUGF0aHMubGVuZ3RoID49IE1BWF9MRVZFTF9GT1JfRk9MREVSU31cbiAgICAgICAgICAgICAgbm9QYWRkaW5nV2hlbkFycm93SXNIaWRkZW49e2VkaXRhYmxlICYmIGZpcnN0TGV2ZWwgJiYgZGF0YUNoaWxkcmVuPy5sZW5ndGggPT09IDB9XG4gICAgICAgICAgICAgIHNldEZvY3VzZWRGb2xkZXJJZD17c2V0Rm9jdXNlZEZvbGRlcklkfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICB7bmV3Rm9sZGVyPy5wYXJlbnRJZCA9PT0gaWQgJiYgKFxuICAgICAgICAgICAgPEZvbGRlck5hbWVJbnB1dFxuICAgICAgICAgICAgICBsb2FkaW5nPXtsb2FkaW5nfVxuICAgICAgICAgICAgICBvbkNhbmNlbE5ld0ZvbGRlcj17b25DYW5jZWxOZXdGb2xkZXJ9XG4gICAgICAgICAgICAgIG9uU2F2ZU5ld0ZvbGRlcj17b25TYXZlTmV3Rm9sZGVyfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICApfVxuICAgICAgICAgIHtkYXRhQ2hpbGRyZW4gJiYgaXNPcGVuICYmIChcbiAgICAgICAgICAgIDxGb2xkZXJJdGVtc1xuICAgICAgICAgICAgICBsb2FkaW5nPXtsb2FkaW5nfVxuICAgICAgICAgICAgICBuZXdGb2xkZXI9e25ld0ZvbGRlcn1cbiAgICAgICAgICAgICAgb3BlbkZvbGRlcnM9e29wZW5Gb2xkZXJzfVxuICAgICAgICAgICAgICBpZFBhdGhzPXtuZXdJZFBhdGhzfVxuICAgICAgICAgICAgICBlZGl0YWJsZT17ZWRpdGFibGV9XG4gICAgICAgICAgICAgIGRhdGE9e2RhdGFDaGlsZHJlbn1cbiAgICAgICAgICAgICAgb25Ub2dnbGVPcGVuPXtvblRvZ2dsZU9wZW59XG4gICAgICAgICAgICAgIG9uQ3JlYXRlTmV3Rm9sZGVyPXtvbkNyZWF0ZU5ld0ZvbGRlcn1cbiAgICAgICAgICAgICAgb25TYXZlTmV3Rm9sZGVyPXtvblNhdmVOZXdGb2xkZXJ9XG4gICAgICAgICAgICAgIG9uQ2FuY2VsTmV3Rm9sZGVyPXtvbkNhbmNlbE5ld0ZvbGRlcn1cbiAgICAgICAgICAgICAgbWFya2VkRm9sZGVySWQ9e21hcmtlZEZvbGRlcklkfVxuICAgICAgICAgICAgICBvbk1hcmtGb2xkZXI9e29uTWFya0ZvbGRlcn1cbiAgICAgICAgICAgICAgb3Blbk9uRm9sZGVyQ2xpY2s9e29wZW5PbkZvbGRlckNsaWNrfVxuICAgICAgICAgICAgICBmb2N1c2VkRm9sZGVySWQ9e2ZvY3VzZWRGb2xkZXJJZH1cbiAgICAgICAgICAgICAgc2V0Rm9jdXNlZEZvbGRlcklkPXtzZXRGb2N1c2VkRm9sZGVySWR9XG4gICAgICAgICAgICAgIGZpcnN0TGV2ZWw9e2ZhbHNlfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICApfVxuICAgICAgICA8L1N0eWxlZExJPlxuICAgICAgKTtcbiAgICB9KX1cbiAgPC9TdHlsZWRVTD5cbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZvbGRlckl0ZW1zO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+
+var FolderItems = function FolderItems(_ref2) {
+  var loading = _ref2.loading,
+      data = _ref2.data,
+      idPaths = _ref2.idPaths,
+      editable = _ref2.editable,
+      onToggleOpen = _ref2.onToggleOpen,
+      onCreateNewFolder = _ref2.onCreateNewFolder,
+      onCancelNewFolder = _ref2.onCancelNewFolder,
+      onSaveNewFolder = _ref2.onSaveNewFolder,
+      newFolder = _ref2.newFolder,
+      openFolders = _ref2.openFolders,
+      markedFolderId = _ref2.markedFolderId,
+      onMarkFolder = _ref2.onMarkFolder,
+      openOnFolderClick = _ref2.openOnFolderClick,
+      focusedFolderId = _ref2.focusedFolderId,
+      setFocusedFolderId = _ref2.setFocusedFolderId,
+      firstLevel = _ref2.firstLevel;
+  return (0, _core2.jsx)(StyledUL, {
+    role: "group",
+    firstLevel: firstLevel
+  }, data.map(function (_ref3, _index) {
+    var name = _ref3.name,
+        dataChildren = _ref3.data,
+        id = _ref3.id,
+        url = _ref3.url,
+        icon = _ref3.icon;
+    var newIdPaths = [].concat(_toConsumableArray(idPaths), [_index]);
+    var isOpen = openFolders === null || openFolders === void 0 ? void 0 : openFolders.has(id);
+    return (0, _core2.jsx)(StyledLI, {
+      key: id,
+      role: "treeitem"
+    }, (0, _core2.jsx)("div", null, (0, _core2.jsx)(_FolderItem["default"], {
+      icon: icon,
+      url: url,
+      openOnFolderClick: openOnFolderClick,
+      loading: loading,
+      isOpen: isOpen,
+      id: id,
+      name: name,
+      markedFolderId: markedFolderId,
+      focusedFolderId: focusedFolderId,
+      onToggleOpen: onToggleOpen,
+      onMarkFolder: onMarkFolder,
+      hideArrow: (dataChildren === null || dataChildren === void 0 ? void 0 : dataChildren.length) === 0 || newIdPaths.length >= _TreeStructure.MAX_LEVEL_FOR_FOLDERS,
+      noPaddingWhenArrowIsHidden: editable && firstLevel && (dataChildren === null || dataChildren === void 0 ? void 0 : dataChildren.length) === 0,
+      setFocusedFolderId: setFocusedFolderId
+    })), (newFolder === null || newFolder === void 0 ? void 0 : newFolder.parentId) === id && (0, _core2.jsx)(_FolderNameInput["default"], {
+      loading: loading,
+      onCancelNewFolder: onCancelNewFolder,
+      onSaveNewFolder: onSaveNewFolder
+    }), dataChildren && isOpen && (0, _core2.jsx)(FolderItems, {
+      loading: loading,
+      newFolder: newFolder,
+      openFolders: openFolders,
+      idPaths: newIdPaths,
+      editable: editable,
+      data: dataChildren,
+      onToggleOpen: onToggleOpen,
+      onCreateNewFolder: onCreateNewFolder,
+      onSaveNewFolder: onSaveNewFolder,
+      onCancelNewFolder: onCancelNewFolder,
+      markedFolderId: markedFolderId,
+      onMarkFolder: onMarkFolder,
+      openOnFolderClick: openOnFolderClick,
+      focusedFolderId: focusedFolderId,
+      setFocusedFolderId: setFocusedFolderId,
+      firstLevel: false
+    }));
+  }));
+};
+
+var _default = FolderItems;
+exports["default"] = _default;

package/lib/TreeStructure/FolderNameInput.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+/// <reference types="react" />
+interface FolderNameInputProps {
+    onSaveNewFolder: (value: string) => void;
+    onCancelNewFolder: () => void;
+    loading?: boolean;
+}
+declare const FolderNameInput: ({ onSaveNewFolder, onCancelNewFolder, loading }: FolderNameInputProps) => JSX.Element;
+export default FolderNameInput;