@bigbinary/neeto-folders-frontend 2.0.4 → 2.0.5

package/dist/components.js

@@ -16,10 +16,10 @@ import Pane from '@bigbinary/neetoui/Pane';
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
 import React, { createElement, forwardRef, useMemo, useState, useId, useEffect, startTransition } from 'react';
-import { useField, Formik, Form } from 'formik';
 import Typography from '@bigbinary/neetoui/Typography';
 import Input from '@bigbinary/neetoui/formik/Input';
 import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
+import Form from '@bigbinary/neetoui/formik/Form';
 import { t as t$1 } from 'i18next';
 import { object, string } from 'yup';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
@@ -28,9 +28,11 @@ import Textarea from '@bigbinary/neetoui/formik/Textarea';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import { ConfigProvider, TreeSelect as TreeSelect$1 } from 'antd';
 import classNames from 'classnames';
+import { useField } from 'formik';
 import Down from '@bigbinary/neeto-icons/Down';
 import Label from '@bigbinary/neetoui/Label';
 import { values, isEmpty, assoc } from 'ramda';
+import useHotkeys from '@bigbinary/neeto-hotkeys';
 import Button from '@bigbinary/neetoui/Button';
 import { noop, isNotPresent } from '@bigbinary/neeto-cist';
 import Radio from '@bigbinary/neetoui/Radio';
@@ -248,7 +250,7 @@ var TreeSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
         suffixIcon: /*#__PURE__*/jsx(Down, {}),
         treeNodeFilterProp: (_fieldNames$label = fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label) !== null && _fieldNames$label !== void 0 ? _fieldNames$label : "title",
         value: field.value || undefined,
-        className: classNames("neeto-ui-tree-select__wrapper", className, {
+        className: classNames("neeto-ui-tree-select__wrapper nf-tree-select", className, {
           "neeto-ui-tree-select__error": meta.error
         }),
         switcherIcon: function switcherIcon(props) {
@@ -403,54 +405,55 @@ var AddEditPane = function AddEditPane(_ref) {
         style: "h2",
         children: isEditing ? t("folders.edit") : t("folders.add")
       })
-    }), /*#__PURE__*/jsx(Formik, {
-      initialValues: initialValues,
-      enableReinitialize: true,
-      validationSchema: FORM_VALIDATION_SCHEMA,
-      onSubmit: onSubmitForm,
-      children: function children() {
-        return /*#__PURE__*/jsxs(Fragment, {
-          children: [/*#__PURE__*/jsx(Pane.Body, {
-            className: "pb-6",
-            children: /*#__PURE__*/jsxs(Form, {
-              className: "w-full space-y-5",
-              children: [/*#__PURE__*/jsx(Input, {
-                required: true,
-                label: t("folders.name"),
-                name: "name",
-                ref: setFocusField
-              }), /*#__PURE__*/jsx(ExtraAttributes, {
-                attributes: extraAttributes
-              }), /*#__PURE__*/jsxs("div", {
-                children: [/*#__PURE__*/jsx(TreeSelect, {
-                  allowClear: true,
-                  showSearch: true,
-                  label: t("createFolder.parentTitle"),
-                  name: "parentId",
-                  treeData: folderOptions
-                }), /*#__PURE__*/jsx(Typography, {
-                  className: "mt-1",
-                  style: "body3",
-                  children: t("createFolder.parentInfo")
-                })]
+    }), /*#__PURE__*/jsx(Form, {
+      className: "flex flex-grow flex-col",
+      formikProps: {
+        initialValues: initialValues,
+        enableReinitialize: true,
+        validationSchema: FORM_VALIDATION_SCHEMA,
+        onSubmit: onSubmitForm
+      },
+      children: /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(Pane.Body, {
+          className: "pb-6",
+          children: /*#__PURE__*/jsxs("div", {
+            className: "w-full space-y-5",
+            children: [/*#__PURE__*/jsx(Input, {
+              required: true,
+              label: t("folders.name"),
+              name: "name",
+              ref: setFocusField
+            }), /*#__PURE__*/jsx(ExtraAttributes, {
+              attributes: extraAttributes
+            }), /*#__PURE__*/jsxs("div", {
+              children: [/*#__PURE__*/jsx(TreeSelect, {
+                allowClear: true,
+                showSearch: true,
+                label: t("createFolder.parentTitle"),
+                name: "parentId",
+                treeData: folderOptions
+              }), /*#__PURE__*/jsx(Typography, {
+                className: "mt-1",
+                style: "body3",
+                children: t("createFolder.parentInfo")
               })]
-            })
-          }), /*#__PURE__*/jsx(Pane.Footer, {
-            children: /*#__PURE__*/jsx(ActionBlock, {
-              cancelButtonProps: {
-                onClick: onClose
-              }
-            })
-          })]
-        });
-      }
+            })]
+          })
+        }), /*#__PURE__*/jsx(Pane.Footer, {
+          children: /*#__PURE__*/jsx(ActionBlock, {
+            cancelButtonProps: {
+              onClick: onClose
+            }
+          })
+        })]
+      })
     })]
   });
 };
 
 var REORDER_TREE_INDENT_WIDTH = 30;
 
-var _excluded$4 = ["icon", "itemLabel", "folder", "depth", "className", "onClick"];
+var _excluded$4 = ["icon", "itemLabel", "folder", "folderLabel", "depth", "className", "onClick"];
 function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Node = function Node(_ref, ref) {
@@ -459,18 +462,15 @@ var Node = function Node(_ref, ref) {
     icon = _ref$icon === void 0 ? null : _ref$icon,
     itemLabel = _ref.itemLabel,
     folder = _ref.folder,
+    folderLabel = _ref.folderLabel,
     depth = _ref.depth,
     className = _ref.className,
     onClick = _ref.onClick,
     rest = _objectWithoutProperties(_ref, _excluded$4);
-  var _useTranslation = useTranslation$1(),
-    t = _useTranslation.t;
   var metaInfo = [];
   var childCount = (_folder$children$leng = (_folder$children = folder.children) === null || _folder$children === void 0 ? void 0 : _folder$children.length) !== null && _folder$children$leng !== void 0 ? _folder$children$leng : 0;
-  childCount > 0 && metaInfo.push(t("folders.subfolderCount", {
-    count: childCount
-  }));
-  folder.itemCount > 0 && metaInfo.push("".concat(folder.itemCount, " ").concat(itemLabel));
+  childCount > 0 && metaInfo.push("".concat(childCount, " ").concat(folderLabel).toLowerCase());
+  folder.itemCount > 0 && metaInfo.push("".concat(folder.itemCount, " ").concat(itemLabel).toLowerCase());
   return /*#__PURE__*/jsxs("div", {
     className: "flex w-full min-w-0",
     children: [Array.from({
@@ -512,6 +512,7 @@ var _excluded$3 = ["folder", "item", "depth", "maxDepth", "disabled", "config"];
 function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var _SelectableNode = function SelectableNode(_ref) {
+  var _folder$children$leng, _folder$children;
   var folder = _ref.folder,
     item = _ref.item,
     _ref$depth = _ref.depth,
@@ -525,6 +526,8 @@ var _SelectableNode = function SelectableNode(_ref) {
   var _useTranslation = useTranslation(config),
     t = _useTranslation.t;
   var isDisabled = disabled || (item === null || item === void 0 ? void 0 : item.id) === folder.id || depth > maxDepth;
+  var itemLabel = config.labels[folder.itemCount > 1 ? "items" : "item"];
+  var folderLabel = config.labels[((_folder$children$leng = (_folder$children = folder.children) === null || _folder$children === void 0 ? void 0 : _folder$children.length) !== null && _folder$children$leng !== void 0 ? _folder$children$leng : 0) > 1 ? "folders" : "folder"];
   var renderChildren = function renderChildren() {
     if (isNotPresent(folder.children)) return null;
     return folder.children.map(function (child) {
@@ -548,7 +551,9 @@ var _SelectableNode = function SelectableNode(_ref) {
     title: isDisabled ? t("moveToFolder.notAllowed") : undefined,
     children: [/*#__PURE__*/jsx(Node$1, _objectSpread$9(_objectSpread$9({}, _objectSpread$9(_objectSpread$9({}, rest), {}, {
       depth: depth,
-      folder: folder
+      folder: folder,
+      folderLabel: folderLabel,
+      itemLabel: itemLabel
     })), {}, {
       icon: /*#__PURE__*/jsx(Radio.Item, {
         readOnly: true,
@@ -589,6 +594,13 @@ var PaneBody = function PaneBody(_ref) {
     folders = _useFetchFolders$data === void 0 ? [] : _useFetchFolders$data;
   var _useTranslation = useTranslation(config),
     t = _useTranslation.t;
+  var _useFolderStore2 = useFolderStore(function (store) {
+      var _store$paneState;
+      return {
+        type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
+      };
+    }, shallow),
+    type = _useFolderStore2.type;
   var tree = useMemo(function () {
     return [{
       name: "/",
@@ -612,6 +624,12 @@ var PaneBody = function PaneBody(_ref) {
       }
     });
   };
+  useHotkeys(["command+enter", "enter"], function () {
+    return onSubmit(selection);
+  }, {
+    mode: "global",
+    enabled: !!type
+  });
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsxs(Pane.Header, {
       className: "flex items-center justify-between",
@@ -634,7 +652,6 @@ var PaneBody = function PaneBody(_ref) {
           maxDepth: maxDepth,
           selection: selection,
           disabled: (item === null || item === void 0 ? void 0 : item.id) === folder.id || maxDepth <= 0,
-          itemLabel: config.labels.item,
           key: folder.id,
           onSelect: function onSelect(folder) {
             return setSelection(folder.id);
@@ -698,13 +715,16 @@ var MoveFolderPane = function MoveFolderPane(_ref) {
   });
 };
 
-var _excluded$2 = ["folder", "depth"];
+var _excluded$2 = ["folder", "depth", "config", "folderLabel", "itemLabel"];
 function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var _DraggableNode$1 = function DraggableNode(_ref) {
   var folder = _ref.folder,
     _ref$depth = _ref.depth,
     depth = _ref$depth === void 0 ? 0 : _ref$depth,
+    config = _ref.config,
+    folderLabel = _ref.folderLabel,
+    itemLabel = _ref.itemLabel,
     rest = _objectWithoutProperties(_ref, _excluded$2);
   var _useDraggable = useDraggable({
       id: "draggable-item--".concat(folder.id),
@@ -725,10 +745,15 @@ var _DraggableNode$1 = function DraggableNode(_ref) {
   var renderChildren = function renderChildren() {
     if (isNotPresent(folder.children) || isDragging) return null;
     return folder.children.map(function (child) {
-      return /*#__PURE__*/createElement(_DraggableNode$1, _objectSpread$7(_objectSpread$7({}, rest), {}, {
+      var _child$children$lengt, _child$children;
+      return /*#__PURE__*/createElement(_DraggableNode$1, _objectSpread$7(_objectSpread$7({}, _objectSpread$7(_objectSpread$7({}, rest), {}, {
+        config: config
+      })), {}, {
         depth: depth + 1,
         folder: child,
-        key: child.id
+        itemLabel: config.labels[(child === null || child === void 0 ? void 0 : child.itemCount) > 1 ? "items" : "item"],
+        key: child.id,
+        folderLabel: config.labels[((_child$children$lengt = child === null || child === void 0 || (_child$children = child.children) === null || _child$children === void 0 ? void 0 : _child$children.length) !== null && _child$children$lengt !== void 0 ? _child$children$lengt : 0) > 1 ? "folders" : "folder"]
       }));
     });
   };
@@ -740,10 +765,13 @@ var _DraggableNode$1 = function DraggableNode(_ref) {
         "neeto-ui-border-primary-500 border": isOver,
         "border border-transparent": !isOver
       })
-    }, _objectSpread$7(_objectSpread$7({
+    }, _objectSpread$7(_objectSpread$7(_objectSpread$7({
       depth: depth,
       folder: folder
-    }, attributes), listeners)), {}, {
+    }, attributes), listeners), {}, {
+      folderLabel: folderLabel,
+      itemLabel: itemLabel
+    })), {}, {
       ref: function ref(_ref2) {
         setDroppableRef(_ref2);
         setDraggableRef(_ref2);
@@ -755,6 +783,7 @@ var _DraggableNode$1 = function DraggableNode(_ref) {
 function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
+  var _tree$children$length, _tree$children, _dragItem$children$le, _dragItem$children;
   var config = _ref.config,
     onClose = _ref.onClose;
   var _useState = useState(null),
@@ -771,6 +800,13 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
     folders = _useFetchFolders.data;
   var _useReorderFolders = useReorderFolders(config),
     reorderFolders = _useReorderFolders.mutate;
+  var _useFolderStore = useFolderStore(function (store) {
+      var _store$paneState;
+      return {
+        type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
+      };
+    }, shallow),
+    type = _useFolderStore.type;
   var _useStateWithDependen = useStateWithDependency(function () {
       return {
         name: "/",
@@ -817,11 +853,14 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
       onSuccess: onClose
     });
   };
+  useHotkeys(["command+enter", "enter"], onSubmit, {
+    mode: "global",
+    enabled: !!type
+  });
   var nodeProps = {
     icon: /*#__PURE__*/jsx(Reorder, {
       className: "neeto-ui-text-gray-500 relative -left-[0.3125rem] flex-shrink-0"
-    }),
-    itemLabel: config.labels.item
+    })
   };
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx(Pane.Header, {
@@ -837,9 +876,13 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
       },
       children: [/*#__PURE__*/jsx(Pane.Body, {
         className: "pb-6",
-        children: /*#__PURE__*/createElement(_DraggableNode$1, _objectSpread$6(_objectSpread$6({}, nodeProps), {}, {
+        children: /*#__PURE__*/createElement(_DraggableNode$1, _objectSpread$6(_objectSpread$6({}, _objectSpread$6(_objectSpread$6({}, nodeProps), {}, {
+          config: config
+        })), {}, {
           folder: tree,
-          key: tree.id
+          itemLabel: config.labels[(tree === null || tree === void 0 ? void 0 : tree.itemCount) > 1 ? "items" : "item"],
+          key: tree.id,
+          folderLabel: config.labels[((_tree$children$length = tree === null || tree === void 0 || (_tree$children = tree.children) === null || _tree$children === void 0 ? void 0 : _tree$children.length) !== null && _tree$children$length !== void 0 ? _tree$children$length : 0) > 1 ? "folders" : "folder"]
         }))
       }), /*#__PURE__*/jsxs(Pane.Footer, {
         className: "gap-2",
@@ -858,7 +901,9 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
         children: dragItem && /*#__PURE__*/jsx(Node$1, _objectSpread$6(_objectSpread$6({}, nodeProps), {}, {
           className: "neeto-ui-bg-gray-200",
           depth: 0,
-          folder: dragItem
+          folder: dragItem,
+          folderLabel: config.labels[((_dragItem$children$le = dragItem === null || dragItem === void 0 || (_dragItem$children = dragItem.children) === null || _dragItem$children === void 0 ? void 0 : _dragItem$children.length) !== null && _dragItem$children$le !== void 0 ? _dragItem$children$le : 0) > 1 ? "folders" : "folder"],
+          itemLabel: config.labels[(dragItem === null || dragItem === void 0 ? void 0 : dragItem.itemCount) > 1 ? "items" : "item"]
         }))
       }), document.body)]
     })]
@@ -956,13 +1001,16 @@ var PlaceholderNode = function PlaceholderNode(_ref) {
   });
 };
 
-var _excluded$1 = ["folder", "dragState"];
+var _excluded$1 = ["folder", "config", "dragState", "folderLabel", "itemLabel"];
 function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var _DraggableNode = function DraggableNode(_ref) {
   var _overItem$meta$parent;
   var folder = _ref.folder,
+    config = _ref.config,
     dragState = _ref.dragState,
+    folderLabel = _ref.folderLabel,
+    itemLabel = _ref.itemLabel,
     rest = _objectWithoutProperties(_ref, _excluded$1);
   var overItem = dragState.overItem;
   var isOverItem = folder.id === (overItem === null || overItem === void 0 ? void 0 : overItem.id);
@@ -990,12 +1038,16 @@ var _DraggableNode = function DraggableNode(_ref) {
         dragState: dragState,
         folder: folder
       }), isArray(folder.children) && folder.children.map(function (child) {
+        var _child$children$lengt, _child$children;
         return /*#__PURE__*/createElement(_DraggableNode, _objectSpread$5(_objectSpread$5({}, _objectSpread$5(_objectSpread$5({}, rest), {}, {
+          config: config,
           dragState: dragState
         })), {}, {
           depth: child.meta.depth,
           folder: child,
-          key: child.id
+          itemLabel: config.labels[(child === null || child === void 0 ? void 0 : child.itemCount) > 1 ? "items" : "item"],
+          key: child.id,
+          folderLabel: config.labels[((_child$children$lengt = child === null || child === void 0 || (_child$children = child.children) === null || _child$children === void 0 ? void 0 : _child$children.length) !== null && _child$children$lengt !== void 0 ? _child$children$lengt : 0) > 1 ? "folders" : "folder"]
         }));
       })]
     }, "".concat(folder.id, "--container"));
@@ -1003,9 +1055,12 @@ var _DraggableNode = function DraggableNode(_ref) {
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx(Node$1, _objectSpread$5(_objectSpread$5({
       depth: folder.meta.depth
-    }, _objectSpread$5(_objectSpread$5(_objectSpread$5({}, rest), {}, {
+    }, _objectSpread$5(_objectSpread$5(_objectSpread$5(_objectSpread$5({}, rest), {}, {
       folder: folder
-    }, attributes), listeners)), {}, {
+    }, attributes), listeners), {}, {
+      folderLabel: folderLabel,
+      itemLabel: itemLabel
+    })), {}, {
       className: classNames({
         "hover:neeto-ui-bg-gray-100 w-full cursor-move transition-colors": true,
         "neeto-ui-bg-gray-100 opacity-50": isDragging,
@@ -1039,6 +1094,7 @@ var measuringConfig = {
 
 // Reorder with support for position adjustment
 var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
+  var _tree$children$length, _tree$children, _dragState$activeItem, _dragState$activeItem2, _dragState$activeItem3;
   var config = _ref.config,
     onClose = _ref.onClose;
   var _useState = useState(initialDragState),
@@ -1056,6 +1112,13 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
   var _useReorderFolders = useReorderFolders(config),
     reorderFolders = _useReorderFolders.mutate;
   var sensors = useSensors(useSensor(PointerSensor, sensorConfig));
+  var _useFolderStore = useFolderStore(function (store) {
+      var _store$paneState;
+      return {
+        type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
+      };
+    }, shallow),
+    type = _useFolderStore.type;
   var _useStateWithDependen = useStateWithDependency(function () {
       return {
         name: "/",
@@ -1114,11 +1177,14 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
       onSuccess: onClose
     });
   };
+  useHotkeys(["command+enter", "enter"], onSubmit, {
+    mode: "global",
+    enabled: !!type
+  });
   var nodeProps = {
     icon: /*#__PURE__*/jsx(Reorder, {
       className: "neeto-ui-text-gray-500 relative -left-[0.3125rem] flex-shrink-0"
-    }),
-    itemLabel: config.labels.item
+    })
   };
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx(Pane.Header, {
@@ -1142,10 +1208,13 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
       children: [/*#__PURE__*/jsx(Pane.Body, {
         className: "pb-6",
         children: /*#__PURE__*/createElement(_DraggableNode, _objectSpread$4(_objectSpread$4({}, _objectSpread$4(_objectSpread$4({}, nodeProps), {}, {
+          config: config,
           dragState: dragState
         })), {}, {
           folder: tree,
-          key: tree.id
+          itemLabel: config.labels[(tree === null || tree === void 0 ? void 0 : tree.itemCount) > 1 ? "items" : "item"],
+          key: tree.id,
+          folderLabel: config.labels[((_tree$children$length = tree === null || tree === void 0 || (_tree$children = tree.children) === null || _tree$children === void 0 ? void 0 : _tree$children.length) !== null && _tree$children$length !== void 0 ? _tree$children$length : 0) > 1 ? "folders" : "folder"]
         }))
       }), /*#__PURE__*/jsxs(Pane.Footer, {
         className: "gap-2",
@@ -1164,7 +1233,9 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
         children: dragState && /*#__PURE__*/jsx(Node$1, _objectSpread$4(_objectSpread$4({}, nodeProps), {}, {
           className: "neeto-ui-bg-gray-200 pl-4 pr-12",
           depth: 0,
-          folder: dragState.activeItem
+          folder: dragState.activeItem,
+          folderLabel: config.labels[((_dragState$activeItem = (_dragState$activeItem2 = dragState.activeItem) === null || _dragState$activeItem2 === void 0 || (_dragState$activeItem2 = _dragState$activeItem2.children) === null || _dragState$activeItem2 === void 0 ? void 0 : _dragState$activeItem2.length) !== null && _dragState$activeItem !== void 0 ? _dragState$activeItem : 0) > 1 ? "folders" : "folder"],
+          itemLabel: config.labels[((_dragState$activeItem3 = dragState.activeItem) === null || _dragState$activeItem3 === void 0 ? void 0 : _dragState$activeItem3.itemCount) > 1 ? "items" : "item"]
         }))
       }), document.body)]
     })]
@@ -1226,10 +1297,9 @@ var FoldersContext = function FoldersContext(_ref) {
 };
 
 var FolderTile = function FolderTile(_ref) {
-  var _folder$children$leng, _folder$children;
+  var _folder$children$leng, _folder$children, _folder$children$leng2, _folder$children2;
   var isSelected = _ref.isSelected,
     link = _ref.link,
-    itemLabel = _ref.itemLabel,
     folder = _ref.folder,
     actions = _ref.actions,
     config = _ref.config,
@@ -1248,7 +1318,7 @@ var FolderTile = function FolderTile(_ref) {
     onClick: actionCallback(actions.onEdit)
   }, {
     key: "move",
-    label: t("common.move"),
+    label: t("common.moveToFolder"),
     onClick: actionCallback(actions.onMove)
   }, {
     key: "delete",
@@ -1257,10 +1327,10 @@ var FolderTile = function FolderTile(_ref) {
   }];
   var metaInfo = [];
   var childCount = (_folder$children$leng = (_folder$children = folder.children) === null || _folder$children === void 0 ? void 0 : _folder$children.length) !== null && _folder$children$leng !== void 0 ? _folder$children$leng : 0;
-  childCount > 0 && metaInfo.push(t("folders.subfolderCount", {
-    count: childCount
-  }));
-  metaInfo.push("".concat(folder.itemCount || 0, " ").concat(itemLabel));
+  var itemLabel = config.labels[folder.itemCount > 1 ? "items" : "item"];
+  var folderLabel = config.labels[((_folder$children$leng2 = (_folder$children2 = folder.children) === null || _folder$children2 === void 0 ? void 0 : _folder$children2.length) !== null && _folder$children$leng2 !== void 0 ? _folder$children$leng2 : 0) > 1 ? "folders" : "folder"];
+  childCount > 0 && metaInfo.push("".concat(childCount, " ").concat(folderLabel).toLowerCase());
+  metaInfo.push("".concat(folder.itemCount || 0, " ").concat(itemLabel).toLowerCase());
   return /*#__PURE__*/jsxs(Link, {
     className: "neeto-ui-bg-gray-50 neeto-ui-border-gray-200 neeto-ui-rounded-md hover:neeto-ui-border-primary-500 relative flex max-w-full items-start gap-2 border-2 p-3 transition-colors ease-in",
     to: link,
@@ -1335,7 +1405,6 @@ var FoldersList = function FoldersList(_ref) {
           folder: folder,
           onSelect: onSelect,
           isSelected: selection.includes(folder.id),
-          itemLabel: config.labels.item,
           key: folder.id,
           link: buildUrl(config.folderPath, _objectSpread$2(_objectSpread$2({}, params), {}, {
             folderId: folder.sid
@@ -1466,7 +1535,7 @@ var FoldersTree = function FoldersTree(_ref) {
 
 var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
 
-var css = ".neeto-sidebar-folders-tree__folder-node{color:inherit!important}.neeto-sidebar-folders-tree.ant-tree .ant-tree-node-content-wrapper{min-width:0;padding-inline:6px!important}.neeto-sidebar-folders-tree.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:rgb(var(--neeto-ui-white));color:rgb(var(--neeto-ui-accent-800))!important;font-weight:500}.neeto-sidebar-folders-tree.ant-tree .ant-tree-switcher .ant-tree-switcher-icon{position:relative}.neeto-folders-grid-view-wrapper{grid-template-columns:repeat(auto-fill,minmax(256px,1fr))}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFwcC9qYXZhc2NyaXB0L3NyYy9jb21wb25lbnRzL25lZXRvLWZvbGRlcnMtbmFuby5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHlDQUNFLHVCQUNGLENBRUEsb0VBRUUsV0FBQSxDQURBLDRCQUVGLENBRUEsMkZBRUUsMkNBQUEsQ0FEQSwrQ0FBQSxDQUVBLGVBQ0YsQ0FFQSxnRkFDRSxpQkFDRixDQUVBLGlDQUNFLHlEQUNGIiwic291cmNlc0NvbnRlbnQiOlsiLm5lZXRvLXNpZGViYXItZm9sZGVycy10cmVlX19mb2xkZXItbm9kZSB7XG4gIGNvbG9yOiBpbmhlcml0ICFpbXBvcnRhbnQ7XG59XG5cbi5uZWV0by1zaWRlYmFyLWZvbGRlcnMtdHJlZS5hbnQtdHJlZSAuYW50LXRyZWUtbm9kZS1jb250ZW50LXdyYXBwZXIge1xuICBwYWRkaW5nLWlubGluZTogNnB4ICFpbXBvcnRhbnQ7XG4gIG1pbi13aWR0aDogMDtcbn1cblxuLm5lZXRvLXNpZGViYXItZm9sZGVycy10cmVlLmFudC10cmVlIC5hbnQtdHJlZS1ub2RlLWNvbnRlbnQtd3JhcHBlci5hbnQtdHJlZS1ub2RlLXNlbGVjdGVkIHtcbiAgY29sb3I6IHJnYih2YXIoLS1uZWV0by11aS1hY2NlbnQtODAwKSkgIWltcG9ydGFudDtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLXdoaXRlKSk7XG4gIGZvbnQtd2VpZ2h0OiA1MDA7XG59XG5cbi5uZWV0by1zaWRlYmFyLWZvbGRlcnMtdHJlZS5hbnQtdHJlZSAuYW50LXRyZWUtc3dpdGNoZXIgLmFudC10cmVlLXN3aXRjaGVyLWljb24ge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbi5uZWV0by1mb2xkZXJzLWdyaWQtdmlldy13cmFwcGVyIHtcbiAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiByZXBlYXQoYXV0by1maWxsLCBtaW5tYXgoMjU2cHgsIDFmcikpO1xufSJdfQ== */";
+var css = ".neeto-sidebar-folders-tree__folder-node{color:inherit!important}.neeto-sidebar-folders-tree.ant-tree .ant-tree-node-content-wrapper{min-width:0;padding-inline:6px!important}.neeto-sidebar-folders-tree.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:rgb(var(--neeto-ui-white));color:rgb(var(--neeto-ui-accent-800))!important;font-weight:500}.neeto-sidebar-folders-tree.ant-tree .ant-tree-switcher .ant-tree-switcher-icon{position:relative}.neeto-folders-grid-view-wrapper{grid-template-columns:repeat(auto-fill,minmax(256px,1fr))}.nf-tree-select .ant-select-clear{height:16px;margin-top:-8px;width:16px}.nf-tree-select .ant-select-clear svg{height:16px;width:16px}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFwcC9qYXZhc2NyaXB0L3NyYy9jb21wb25lbnRzL25lZXRvLWZvbGRlcnMtbmFuby5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHlDQUNFLHVCQUNGLENBRUEsb0VBRUUsV0FBQSxDQURBLDRCQUVGLENBRUEsMkZBR0UsMkNBQUEsQ0FEQSwrQ0FBQSxDQUVBLGVBQUYsQ0FHQSxnRkFHRSxpQkFGRixDQUtBLGlDQUNFLHlEQUZGLENBTUUsa0NBRUUsV0FBQSxDQUNBLGVBQUEsQ0FGQSxVQURKLENBS0ksc0NBRUUsV0FBQSxDQURBLFVBRk4iLCJzb3VyY2VzQ29udGVudCI6WyIubmVldG8tc2lkZWJhci1mb2xkZXJzLXRyZWVfX2ZvbGRlci1ub2RlIHtcbiAgY29sb3I6IGluaGVyaXQgIWltcG9ydGFudDtcbn1cblxuLm5lZXRvLXNpZGViYXItZm9sZGVycy10cmVlLmFudC10cmVlIC5hbnQtdHJlZS1ub2RlLWNvbnRlbnQtd3JhcHBlciB7XG4gIHBhZGRpbmctaW5saW5lOiA2cHggIWltcG9ydGFudDtcbiAgbWluLXdpZHRoOiAwO1xufVxuXG4ubmVldG8tc2lkZWJhci1mb2xkZXJzLXRyZWUuYW50LXRyZWVcbiAgLmFudC10cmVlLW5vZGUtY29udGVudC13cmFwcGVyLmFudC10cmVlLW5vZGUtc2VsZWN0ZWQge1xuICBjb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLWFjY2VudC04MDApKSAhaW1wb3J0YW50O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2IodmFyKC0tbmVldG8tdWktd2hpdGUpKTtcbiAgZm9udC13ZWlnaHQ6IDUwMDtcbn1cblxuLm5lZXRvLXNpZGViYXItZm9sZGVycy10cmVlLmFudC10cmVlXG4gIC5hbnQtdHJlZS1zd2l0Y2hlclxuICAuYW50LXRyZWUtc3dpdGNoZXItaWNvbiB7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbn1cblxuLm5lZXRvLWZvbGRlcnMtZ3JpZC12aWV3LXdyYXBwZXIge1xuICBncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdChhdXRvLWZpbGwsIG1pbm1heCgyNTZweCwgMWZyKSk7XG59XG5cbi5uZi10cmVlLXNlbGVjdCB7XG4gIC5hbnQtc2VsZWN0LWNsZWFyIHtcbiAgICB3aWR0aDogMTZweDtcbiAgICBoZWlnaHQ6IDE2cHg7XG4gICAgbWFyZ2luLXRvcDogLThweDtcblxuICAgIHN2ZyB7XG4gICAgICB3aWR0aDogMTZweDtcbiAgICAgIGhlaWdodDogMTZweDtcbiAgICB9XG4gIH1cbn1cbiJdfQ== */";
 n(css,{});
 
 export { FoldersContext, FoldersList, FoldersTree, MoveToFolderPane };