@bigbinary/neeto-folders-frontend 2.0.4 → 2.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/app/javascript/src/translations/en.json +2 -4
- package/dist/cjs/components.js +164 -81
- package/dist/cjs/components.js.map +1 -1
- package/dist/components.js +164 -81
- package/dist/components.js.map +1 -1
- package/package.json +14 -12
- package/types.d.ts +1 -0
package/dist/components.js
CHANGED
|
@@ -16,10 +16,10 @@ import Pane from '@bigbinary/neetoui/Pane';
|
|
|
16
16
|
import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
|
|
17
17
|
import _regeneratorRuntime from '@babel/runtime/regenerator';
|
|
18
18
|
import React, { createElement, forwardRef, useMemo, useState, useId, useEffect, startTransition } from 'react';
|
|
19
|
-
import { useField, Formik, Form } from 'formik';
|
|
20
19
|
import Typography from '@bigbinary/neetoui/Typography';
|
|
21
20
|
import Input from '@bigbinary/neetoui/formik/Input';
|
|
22
21
|
import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
|
|
22
|
+
import Form from '@bigbinary/neetoui/formik/Form';
|
|
23
23
|
import { t as t$1 } from 'i18next';
|
|
24
24
|
import { object, string } from 'yup';
|
|
25
25
|
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
@@ -28,9 +28,11 @@ import Textarea from '@bigbinary/neetoui/formik/Textarea';
|
|
|
28
28
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
29
29
|
import { ConfigProvider, TreeSelect as TreeSelect$1 } from 'antd';
|
|
30
30
|
import classNames from 'classnames';
|
|
31
|
+
import { useField } from 'formik';
|
|
31
32
|
import Down from '@bigbinary/neeto-icons/Down';
|
|
32
33
|
import Label from '@bigbinary/neetoui/Label';
|
|
33
34
|
import { values, isEmpty, assoc } from 'ramda';
|
|
35
|
+
import useHotkeys from '@bigbinary/neeto-hotkeys';
|
|
34
36
|
import Button from '@bigbinary/neetoui/Button';
|
|
35
37
|
import { noop, isNotPresent } from '@bigbinary/neeto-cist';
|
|
36
38
|
import Radio from '@bigbinary/neetoui/Radio';
|
|
@@ -100,6 +102,7 @@ var FoldersAlerts = function FoldersAlerts(_ref) {
|
|
|
100
102
|
};
|
|
101
103
|
var onConfirmDelete = function onConfirmDelete() {
|
|
102
104
|
var onSuccess = function onSuccess() {
|
|
105
|
+
var _config$onUpdateSucce;
|
|
103
106
|
var isActive = isActiveFolder(config, item.sid);
|
|
104
107
|
// Invalidates items and folder details. Refetch only if not active folder.
|
|
105
108
|
var invalidationKeys = [].concat(_toConsumableArray(config.invalidationKeys), [[QUERY_KEYS.FOLDERS, config.type, QUERY_KEYS.DETAILS]]);
|
|
@@ -117,6 +120,7 @@ var FoldersAlerts = function FoldersAlerts(_ref) {
|
|
|
117
120
|
})) : "/";
|
|
118
121
|
history.replace(redirectUrl);
|
|
119
122
|
}
|
|
123
|
+
(_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
|
|
120
124
|
};
|
|
121
125
|
destroyFolder(item.id, {
|
|
122
126
|
onSuccess: onSuccess,
|
|
@@ -248,7 +252,7 @@ var TreeSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
248
252
|
suffixIcon: /*#__PURE__*/jsx(Down, {}),
|
|
249
253
|
treeNodeFilterProp: (_fieldNames$label = fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label) !== null && _fieldNames$label !== void 0 ? _fieldNames$label : "title",
|
|
250
254
|
value: field.value || undefined,
|
|
251
|
-
className: classNames("neeto-ui-tree-select__wrapper", className, {
|
|
255
|
+
className: classNames("neeto-ui-tree-select__wrapper nf-tree-select", className, {
|
|
252
256
|
"neeto-ui-tree-select__error": meta.error
|
|
253
257
|
}),
|
|
254
258
|
switcherIcon: function switcherIcon(props) {
|
|
@@ -403,54 +407,55 @@ var AddEditPane = function AddEditPane(_ref) {
|
|
|
403
407
|
style: "h2",
|
|
404
408
|
children: isEditing ? t("folders.edit") : t("folders.add")
|
|
405
409
|
})
|
|
406
|
-
}), /*#__PURE__*/jsx(
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
410
|
+
}), /*#__PURE__*/jsx(Form, {
|
|
411
|
+
className: "flex flex-grow flex-col",
|
|
412
|
+
formikProps: {
|
|
413
|
+
initialValues: initialValues,
|
|
414
|
+
enableReinitialize: true,
|
|
415
|
+
validationSchema: FORM_VALIDATION_SCHEMA,
|
|
416
|
+
onSubmit: onSubmitForm
|
|
417
|
+
},
|
|
418
|
+
children: /*#__PURE__*/jsxs(Fragment, {
|
|
419
|
+
children: [/*#__PURE__*/jsx(Pane.Body, {
|
|
420
|
+
className: "pb-6",
|
|
421
|
+
children: /*#__PURE__*/jsxs("div", {
|
|
422
|
+
className: "w-full space-y-5",
|
|
423
|
+
children: [/*#__PURE__*/jsx(Input, {
|
|
424
|
+
required: true,
|
|
425
|
+
label: t("folders.name"),
|
|
426
|
+
name: "name",
|
|
427
|
+
ref: setFocusField
|
|
428
|
+
}), /*#__PURE__*/jsx(ExtraAttributes, {
|
|
429
|
+
attributes: extraAttributes
|
|
430
|
+
}), /*#__PURE__*/jsxs("div", {
|
|
431
|
+
children: [/*#__PURE__*/jsx(TreeSelect, {
|
|
432
|
+
allowClear: true,
|
|
433
|
+
showSearch: true,
|
|
434
|
+
label: t("createFolder.parentTitle"),
|
|
435
|
+
name: "parentId",
|
|
436
|
+
treeData: folderOptions
|
|
437
|
+
}), /*#__PURE__*/jsx(Typography, {
|
|
438
|
+
className: "mt-1",
|
|
439
|
+
style: "body3",
|
|
440
|
+
children: t("createFolder.parentInfo")
|
|
436
441
|
})]
|
|
437
|
-
})
|
|
438
|
-
})
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
}
|
|
444
|
-
})
|
|
445
|
-
})
|
|
446
|
-
}
|
|
442
|
+
})]
|
|
443
|
+
})
|
|
444
|
+
}), /*#__PURE__*/jsx(Pane.Footer, {
|
|
445
|
+
children: /*#__PURE__*/jsx(ActionBlock, {
|
|
446
|
+
cancelButtonProps: {
|
|
447
|
+
onClick: onClose
|
|
448
|
+
}
|
|
449
|
+
})
|
|
450
|
+
})]
|
|
451
|
+
})
|
|
447
452
|
})]
|
|
448
453
|
});
|
|
449
454
|
};
|
|
450
455
|
|
|
451
456
|
var REORDER_TREE_INDENT_WIDTH = 30;
|
|
452
457
|
|
|
453
|
-
var _excluded$4 = ["icon", "itemLabel", "folder", "depth", "className", "onClick"];
|
|
458
|
+
var _excluded$4 = ["icon", "itemLabel", "folder", "folderLabel", "depth", "className", "onClick"];
|
|
454
459
|
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; }
|
|
455
460
|
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; }
|
|
456
461
|
var Node = function Node(_ref, ref) {
|
|
@@ -459,18 +464,15 @@ var Node = function Node(_ref, ref) {
|
|
|
459
464
|
icon = _ref$icon === void 0 ? null : _ref$icon,
|
|
460
465
|
itemLabel = _ref.itemLabel,
|
|
461
466
|
folder = _ref.folder,
|
|
467
|
+
folderLabel = _ref.folderLabel,
|
|
462
468
|
depth = _ref.depth,
|
|
463
469
|
className = _ref.className,
|
|
464
470
|
onClick = _ref.onClick,
|
|
465
471
|
rest = _objectWithoutProperties(_ref, _excluded$4);
|
|
466
|
-
var _useTranslation = useTranslation$1(),
|
|
467
|
-
t = _useTranslation.t;
|
|
468
472
|
var metaInfo = [];
|
|
469
473
|
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;
|
|
470
|
-
childCount > 0 && metaInfo.push(
|
|
471
|
-
|
|
472
|
-
}));
|
|
473
|
-
folder.itemCount > 0 && metaInfo.push("".concat(folder.itemCount, " ").concat(itemLabel));
|
|
474
|
+
childCount > 0 && metaInfo.push("".concat(childCount, " ").concat(folderLabel).toLowerCase());
|
|
475
|
+
folder.itemCount > 0 && metaInfo.push("".concat(folder.itemCount, " ").concat(itemLabel).toLowerCase());
|
|
474
476
|
return /*#__PURE__*/jsxs("div", {
|
|
475
477
|
className: "flex w-full min-w-0",
|
|
476
478
|
children: [Array.from({
|
|
@@ -512,6 +514,7 @@ var _excluded$3 = ["folder", "item", "depth", "maxDepth", "disabled", "config"];
|
|
|
512
514
|
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; }
|
|
513
515
|
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; }
|
|
514
516
|
var _SelectableNode = function SelectableNode(_ref) {
|
|
517
|
+
var _folder$children$leng, _folder$children;
|
|
515
518
|
var folder = _ref.folder,
|
|
516
519
|
item = _ref.item,
|
|
517
520
|
_ref$depth = _ref.depth,
|
|
@@ -525,6 +528,8 @@ var _SelectableNode = function SelectableNode(_ref) {
|
|
|
525
528
|
var _useTranslation = useTranslation(config),
|
|
526
529
|
t = _useTranslation.t;
|
|
527
530
|
var isDisabled = disabled || (item === null || item === void 0 ? void 0 : item.id) === folder.id || depth > maxDepth;
|
|
531
|
+
var itemLabel = config.labels[folder.itemCount > 1 ? "items" : "item"];
|
|
532
|
+
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"];
|
|
528
533
|
var renderChildren = function renderChildren() {
|
|
529
534
|
if (isNotPresent(folder.children)) return null;
|
|
530
535
|
return folder.children.map(function (child) {
|
|
@@ -548,7 +553,9 @@ var _SelectableNode = function SelectableNode(_ref) {
|
|
|
548
553
|
title: isDisabled ? t("moveToFolder.notAllowed") : undefined,
|
|
549
554
|
children: [/*#__PURE__*/jsx(Node$1, _objectSpread$9(_objectSpread$9({}, _objectSpread$9(_objectSpread$9({}, rest), {}, {
|
|
550
555
|
depth: depth,
|
|
551
|
-
folder: folder
|
|
556
|
+
folder: folder,
|
|
557
|
+
folderLabel: folderLabel,
|
|
558
|
+
itemLabel: itemLabel
|
|
552
559
|
})), {}, {
|
|
553
560
|
icon: /*#__PURE__*/jsx(Radio.Item, {
|
|
554
561
|
readOnly: true,
|
|
@@ -589,6 +596,13 @@ var PaneBody = function PaneBody(_ref) {
|
|
|
589
596
|
folders = _useFetchFolders$data === void 0 ? [] : _useFetchFolders$data;
|
|
590
597
|
var _useTranslation = useTranslation(config),
|
|
591
598
|
t = _useTranslation.t;
|
|
599
|
+
var _useFolderStore2 = useFolderStore(function (store) {
|
|
600
|
+
var _store$paneState;
|
|
601
|
+
return {
|
|
602
|
+
type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
|
|
603
|
+
};
|
|
604
|
+
}, shallow),
|
|
605
|
+
type = _useFolderStore2.type;
|
|
592
606
|
var tree = useMemo(function () {
|
|
593
607
|
return [{
|
|
594
608
|
name: "/",
|
|
@@ -612,6 +626,12 @@ var PaneBody = function PaneBody(_ref) {
|
|
|
612
626
|
}
|
|
613
627
|
});
|
|
614
628
|
};
|
|
629
|
+
useHotkeys(["command+enter", "enter"], function () {
|
|
630
|
+
return onSubmit(selection);
|
|
631
|
+
}, {
|
|
632
|
+
mode: "global",
|
|
633
|
+
enabled: !!type
|
|
634
|
+
});
|
|
615
635
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
616
636
|
children: [/*#__PURE__*/jsxs(Pane.Header, {
|
|
617
637
|
className: "flex items-center justify-between",
|
|
@@ -634,7 +654,6 @@ var PaneBody = function PaneBody(_ref) {
|
|
|
634
654
|
maxDepth: maxDepth,
|
|
635
655
|
selection: selection,
|
|
636
656
|
disabled: (item === null || item === void 0 ? void 0 : item.id) === folder.id || maxDepth <= 0,
|
|
637
|
-
itemLabel: config.labels.item,
|
|
638
657
|
key: folder.id,
|
|
639
658
|
onSelect: function onSelect(folder) {
|
|
640
659
|
return setSelection(folder.id);
|
|
@@ -687,7 +706,11 @@ var MoveFolderPane = function MoveFolderPane(_ref) {
|
|
|
687
706
|
id: item.id,
|
|
688
707
|
payload: payload
|
|
689
708
|
}, {
|
|
690
|
-
onSuccess:
|
|
709
|
+
onSuccess: function onSuccess() {
|
|
710
|
+
var _config$onUpdateSucce;
|
|
711
|
+
onClose();
|
|
712
|
+
(_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
|
|
713
|
+
}
|
|
691
714
|
});
|
|
692
715
|
};
|
|
693
716
|
return /*#__PURE__*/jsx(PaneBody, {
|
|
@@ -698,13 +721,16 @@ var MoveFolderPane = function MoveFolderPane(_ref) {
|
|
|
698
721
|
});
|
|
699
722
|
};
|
|
700
723
|
|
|
701
|
-
var _excluded$2 = ["folder", "depth"];
|
|
724
|
+
var _excluded$2 = ["folder", "depth", "config", "folderLabel", "itemLabel"];
|
|
702
725
|
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; }
|
|
703
726
|
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; }
|
|
704
727
|
var _DraggableNode$1 = function DraggableNode(_ref) {
|
|
705
728
|
var folder = _ref.folder,
|
|
706
729
|
_ref$depth = _ref.depth,
|
|
707
730
|
depth = _ref$depth === void 0 ? 0 : _ref$depth,
|
|
731
|
+
config = _ref.config,
|
|
732
|
+
folderLabel = _ref.folderLabel,
|
|
733
|
+
itemLabel = _ref.itemLabel,
|
|
708
734
|
rest = _objectWithoutProperties(_ref, _excluded$2);
|
|
709
735
|
var _useDraggable = useDraggable({
|
|
710
736
|
id: "draggable-item--".concat(folder.id),
|
|
@@ -725,10 +751,15 @@ var _DraggableNode$1 = function DraggableNode(_ref) {
|
|
|
725
751
|
var renderChildren = function renderChildren() {
|
|
726
752
|
if (isNotPresent(folder.children) || isDragging) return null;
|
|
727
753
|
return folder.children.map(function (child) {
|
|
728
|
-
|
|
754
|
+
var _child$children$lengt, _child$children;
|
|
755
|
+
return /*#__PURE__*/createElement(_DraggableNode$1, _objectSpread$7(_objectSpread$7({}, _objectSpread$7(_objectSpread$7({}, rest), {}, {
|
|
756
|
+
config: config
|
|
757
|
+
})), {}, {
|
|
729
758
|
depth: depth + 1,
|
|
730
759
|
folder: child,
|
|
731
|
-
|
|
760
|
+
itemLabel: config.labels[(child === null || child === void 0 ? void 0 : child.itemCount) > 1 ? "items" : "item"],
|
|
761
|
+
key: child.id,
|
|
762
|
+
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"]
|
|
732
763
|
}));
|
|
733
764
|
});
|
|
734
765
|
};
|
|
@@ -740,10 +771,13 @@ var _DraggableNode$1 = function DraggableNode(_ref) {
|
|
|
740
771
|
"neeto-ui-border-primary-500 border": isOver,
|
|
741
772
|
"border border-transparent": !isOver
|
|
742
773
|
})
|
|
743
|
-
}, _objectSpread$7(_objectSpread$7({
|
|
774
|
+
}, _objectSpread$7(_objectSpread$7(_objectSpread$7({
|
|
744
775
|
depth: depth,
|
|
745
776
|
folder: folder
|
|
746
|
-
}, attributes), listeners)
|
|
777
|
+
}, attributes), listeners), {}, {
|
|
778
|
+
folderLabel: folderLabel,
|
|
779
|
+
itemLabel: itemLabel
|
|
780
|
+
})), {}, {
|
|
747
781
|
ref: function ref(_ref2) {
|
|
748
782
|
setDroppableRef(_ref2);
|
|
749
783
|
setDraggableRef(_ref2);
|
|
@@ -755,6 +789,7 @@ var _DraggableNode$1 = function DraggableNode(_ref) {
|
|
|
755
789
|
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; }
|
|
756
790
|
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; }
|
|
757
791
|
var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
|
|
792
|
+
var _tree$children$length, _tree$children, _dragItem$children$le, _dragItem$children;
|
|
758
793
|
var config = _ref.config,
|
|
759
794
|
onClose = _ref.onClose;
|
|
760
795
|
var _useState = useState(null),
|
|
@@ -771,6 +806,13 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
|
|
|
771
806
|
folders = _useFetchFolders.data;
|
|
772
807
|
var _useReorderFolders = useReorderFolders(config),
|
|
773
808
|
reorderFolders = _useReorderFolders.mutate;
|
|
809
|
+
var _useFolderStore = useFolderStore(function (store) {
|
|
810
|
+
var _store$paneState;
|
|
811
|
+
return {
|
|
812
|
+
type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
|
|
813
|
+
};
|
|
814
|
+
}, shallow),
|
|
815
|
+
type = _useFolderStore.type;
|
|
774
816
|
var _useStateWithDependen = useStateWithDependency(function () {
|
|
775
817
|
return {
|
|
776
818
|
name: "/",
|
|
@@ -814,14 +856,21 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
|
|
|
814
856
|
changes: changes
|
|
815
857
|
};
|
|
816
858
|
reorderFolders(payload, {
|
|
817
|
-
onSuccess:
|
|
859
|
+
onSuccess: function onSuccess() {
|
|
860
|
+
var _config$onUpdateSucce;
|
|
861
|
+
onClose();
|
|
862
|
+
(_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
|
|
863
|
+
}
|
|
818
864
|
});
|
|
819
865
|
};
|
|
866
|
+
useHotkeys(["command+enter", "enter"], onSubmit, {
|
|
867
|
+
mode: "global",
|
|
868
|
+
enabled: !!type
|
|
869
|
+
});
|
|
820
870
|
var nodeProps = {
|
|
821
871
|
icon: /*#__PURE__*/jsx(Reorder, {
|
|
822
872
|
className: "neeto-ui-text-gray-500 relative -left-[0.3125rem] flex-shrink-0"
|
|
823
|
-
})
|
|
824
|
-
itemLabel: config.labels.item
|
|
873
|
+
})
|
|
825
874
|
};
|
|
826
875
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
827
876
|
children: [/*#__PURE__*/jsx(Pane.Header, {
|
|
@@ -837,9 +886,13 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
|
|
|
837
886
|
},
|
|
838
887
|
children: [/*#__PURE__*/jsx(Pane.Body, {
|
|
839
888
|
className: "pb-6",
|
|
840
|
-
children: /*#__PURE__*/createElement(_DraggableNode$1, _objectSpread$6(_objectSpread$6({}, nodeProps), {}, {
|
|
889
|
+
children: /*#__PURE__*/createElement(_DraggableNode$1, _objectSpread$6(_objectSpread$6({}, _objectSpread$6(_objectSpread$6({}, nodeProps), {}, {
|
|
890
|
+
config: config
|
|
891
|
+
})), {}, {
|
|
841
892
|
folder: tree,
|
|
842
|
-
|
|
893
|
+
itemLabel: config.labels[(tree === null || tree === void 0 ? void 0 : tree.itemCount) > 1 ? "items" : "item"],
|
|
894
|
+
key: tree.id,
|
|
895
|
+
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"]
|
|
843
896
|
}))
|
|
844
897
|
}), /*#__PURE__*/jsxs(Pane.Footer, {
|
|
845
898
|
className: "gap-2",
|
|
@@ -858,7 +911,9 @@ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
|
|
|
858
911
|
children: dragItem && /*#__PURE__*/jsx(Node$1, _objectSpread$6(_objectSpread$6({}, nodeProps), {}, {
|
|
859
912
|
className: "neeto-ui-bg-gray-200",
|
|
860
913
|
depth: 0,
|
|
861
|
-
folder: dragItem
|
|
914
|
+
folder: dragItem,
|
|
915
|
+
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"],
|
|
916
|
+
itemLabel: config.labels[(dragItem === null || dragItem === void 0 ? void 0 : dragItem.itemCount) > 1 ? "items" : "item"]
|
|
862
917
|
}))
|
|
863
918
|
}), document.body)]
|
|
864
919
|
})]
|
|
@@ -956,13 +1011,16 @@ var PlaceholderNode = function PlaceholderNode(_ref) {
|
|
|
956
1011
|
});
|
|
957
1012
|
};
|
|
958
1013
|
|
|
959
|
-
var _excluded$1 = ["folder", "dragState"];
|
|
1014
|
+
var _excluded$1 = ["folder", "config", "dragState", "folderLabel", "itemLabel"];
|
|
960
1015
|
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; }
|
|
961
1016
|
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; }
|
|
962
1017
|
var _DraggableNode = function DraggableNode(_ref) {
|
|
963
1018
|
var _overItem$meta$parent;
|
|
964
1019
|
var folder = _ref.folder,
|
|
1020
|
+
config = _ref.config,
|
|
965
1021
|
dragState = _ref.dragState,
|
|
1022
|
+
folderLabel = _ref.folderLabel,
|
|
1023
|
+
itemLabel = _ref.itemLabel,
|
|
966
1024
|
rest = _objectWithoutProperties(_ref, _excluded$1);
|
|
967
1025
|
var overItem = dragState.overItem;
|
|
968
1026
|
var isOverItem = folder.id === (overItem === null || overItem === void 0 ? void 0 : overItem.id);
|
|
@@ -990,12 +1048,16 @@ var _DraggableNode = function DraggableNode(_ref) {
|
|
|
990
1048
|
dragState: dragState,
|
|
991
1049
|
folder: folder
|
|
992
1050
|
}), isArray(folder.children) && folder.children.map(function (child) {
|
|
1051
|
+
var _child$children$lengt, _child$children;
|
|
993
1052
|
return /*#__PURE__*/createElement(_DraggableNode, _objectSpread$5(_objectSpread$5({}, _objectSpread$5(_objectSpread$5({}, rest), {}, {
|
|
1053
|
+
config: config,
|
|
994
1054
|
dragState: dragState
|
|
995
1055
|
})), {}, {
|
|
996
1056
|
depth: child.meta.depth,
|
|
997
1057
|
folder: child,
|
|
998
|
-
|
|
1058
|
+
itemLabel: config.labels[(child === null || child === void 0 ? void 0 : child.itemCount) > 1 ? "items" : "item"],
|
|
1059
|
+
key: child.id,
|
|
1060
|
+
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"]
|
|
999
1061
|
}));
|
|
1000
1062
|
})]
|
|
1001
1063
|
}, "".concat(folder.id, "--container"));
|
|
@@ -1003,9 +1065,12 @@ var _DraggableNode = function DraggableNode(_ref) {
|
|
|
1003
1065
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
1004
1066
|
children: [/*#__PURE__*/jsx(Node$1, _objectSpread$5(_objectSpread$5({
|
|
1005
1067
|
depth: folder.meta.depth
|
|
1006
|
-
}, _objectSpread$5(_objectSpread$5(_objectSpread$5({}, rest), {}, {
|
|
1068
|
+
}, _objectSpread$5(_objectSpread$5(_objectSpread$5(_objectSpread$5({}, rest), {}, {
|
|
1007
1069
|
folder: folder
|
|
1008
|
-
}, attributes), listeners)
|
|
1070
|
+
}, attributes), listeners), {}, {
|
|
1071
|
+
folderLabel: folderLabel,
|
|
1072
|
+
itemLabel: itemLabel
|
|
1073
|
+
})), {}, {
|
|
1009
1074
|
className: classNames({
|
|
1010
1075
|
"hover:neeto-ui-bg-gray-100 w-full cursor-move transition-colors": true,
|
|
1011
1076
|
"neeto-ui-bg-gray-100 opacity-50": isDragging,
|
|
@@ -1039,6 +1104,7 @@ var measuringConfig = {
|
|
|
1039
1104
|
|
|
1040
1105
|
// Reorder with support for position adjustment
|
|
1041
1106
|
var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
|
|
1107
|
+
var _tree$children$length, _tree$children, _dragState$activeItem, _dragState$activeItem2, _dragState$activeItem3;
|
|
1042
1108
|
var config = _ref.config,
|
|
1043
1109
|
onClose = _ref.onClose;
|
|
1044
1110
|
var _useState = useState(initialDragState),
|
|
@@ -1056,6 +1122,13 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
|
|
|
1056
1122
|
var _useReorderFolders = useReorderFolders(config),
|
|
1057
1123
|
reorderFolders = _useReorderFolders.mutate;
|
|
1058
1124
|
var sensors = useSensors(useSensor(PointerSensor, sensorConfig));
|
|
1125
|
+
var _useFolderStore = useFolderStore(function (store) {
|
|
1126
|
+
var _store$paneState;
|
|
1127
|
+
return {
|
|
1128
|
+
type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
|
|
1129
|
+
};
|
|
1130
|
+
}, shallow),
|
|
1131
|
+
type = _useFolderStore.type;
|
|
1059
1132
|
var _useStateWithDependen = useStateWithDependency(function () {
|
|
1060
1133
|
return {
|
|
1061
1134
|
name: "/",
|
|
@@ -1111,14 +1184,21 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
|
|
|
1111
1184
|
changes: changes
|
|
1112
1185
|
};
|
|
1113
1186
|
reorderFolders(payload, {
|
|
1114
|
-
onSuccess:
|
|
1187
|
+
onSuccess: function onSuccess() {
|
|
1188
|
+
var _config$onUpdateSucce;
|
|
1189
|
+
onClose();
|
|
1190
|
+
(_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
|
|
1191
|
+
}
|
|
1115
1192
|
});
|
|
1116
1193
|
};
|
|
1194
|
+
useHotkeys(["command+enter", "enter"], onSubmit, {
|
|
1195
|
+
mode: "global",
|
|
1196
|
+
enabled: !!type
|
|
1197
|
+
});
|
|
1117
1198
|
var nodeProps = {
|
|
1118
1199
|
icon: /*#__PURE__*/jsx(Reorder, {
|
|
1119
1200
|
className: "neeto-ui-text-gray-500 relative -left-[0.3125rem] flex-shrink-0"
|
|
1120
|
-
})
|
|
1121
|
-
itemLabel: config.labels.item
|
|
1201
|
+
})
|
|
1122
1202
|
};
|
|
1123
1203
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
1124
1204
|
children: [/*#__PURE__*/jsx(Pane.Header, {
|
|
@@ -1142,10 +1222,13 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
|
|
|
1142
1222
|
children: [/*#__PURE__*/jsx(Pane.Body, {
|
|
1143
1223
|
className: "pb-6",
|
|
1144
1224
|
children: /*#__PURE__*/createElement(_DraggableNode, _objectSpread$4(_objectSpread$4({}, _objectSpread$4(_objectSpread$4({}, nodeProps), {}, {
|
|
1225
|
+
config: config,
|
|
1145
1226
|
dragState: dragState
|
|
1146
1227
|
})), {}, {
|
|
1147
1228
|
folder: tree,
|
|
1148
|
-
|
|
1229
|
+
itemLabel: config.labels[(tree === null || tree === void 0 ? void 0 : tree.itemCount) > 1 ? "items" : "item"],
|
|
1230
|
+
key: tree.id,
|
|
1231
|
+
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"]
|
|
1149
1232
|
}))
|
|
1150
1233
|
}), /*#__PURE__*/jsxs(Pane.Footer, {
|
|
1151
1234
|
className: "gap-2",
|
|
@@ -1164,7 +1247,9 @@ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
|
|
|
1164
1247
|
children: dragState && /*#__PURE__*/jsx(Node$1, _objectSpread$4(_objectSpread$4({}, nodeProps), {}, {
|
|
1165
1248
|
className: "neeto-ui-bg-gray-200 pl-4 pr-12",
|
|
1166
1249
|
depth: 0,
|
|
1167
|
-
folder: dragState.activeItem
|
|
1250
|
+
folder: dragState.activeItem,
|
|
1251
|
+
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"],
|
|
1252
|
+
itemLabel: config.labels[((_dragState$activeItem3 = dragState.activeItem) === null || _dragState$activeItem3 === void 0 ? void 0 : _dragState$activeItem3.itemCount) > 1 ? "items" : "item"]
|
|
1168
1253
|
}))
|
|
1169
1254
|
}), document.body)]
|
|
1170
1255
|
})]
|
|
@@ -1226,10 +1311,9 @@ var FoldersContext = function FoldersContext(_ref) {
|
|
|
1226
1311
|
};
|
|
1227
1312
|
|
|
1228
1313
|
var FolderTile = function FolderTile(_ref) {
|
|
1229
|
-
var _folder$children$leng, _folder$children;
|
|
1314
|
+
var _folder$children$leng, _folder$children, _folder$children$leng2, _folder$children2;
|
|
1230
1315
|
var isSelected = _ref.isSelected,
|
|
1231
1316
|
link = _ref.link,
|
|
1232
|
-
itemLabel = _ref.itemLabel,
|
|
1233
1317
|
folder = _ref.folder,
|
|
1234
1318
|
actions = _ref.actions,
|
|
1235
1319
|
config = _ref.config,
|
|
@@ -1248,7 +1332,7 @@ var FolderTile = function FolderTile(_ref) {
|
|
|
1248
1332
|
onClick: actionCallback(actions.onEdit)
|
|
1249
1333
|
}, {
|
|
1250
1334
|
key: "move",
|
|
1251
|
-
label: t("common.
|
|
1335
|
+
label: t("common.moveToFolder"),
|
|
1252
1336
|
onClick: actionCallback(actions.onMove)
|
|
1253
1337
|
}, {
|
|
1254
1338
|
key: "delete",
|
|
@@ -1257,10 +1341,10 @@ var FolderTile = function FolderTile(_ref) {
|
|
|
1257
1341
|
}];
|
|
1258
1342
|
var metaInfo = [];
|
|
1259
1343
|
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;
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
metaInfo.push("".concat(folder.itemCount || 0, " ").concat(itemLabel));
|
|
1344
|
+
var itemLabel = config.labels[folder.itemCount > 1 ? "items" : "item"];
|
|
1345
|
+
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"];
|
|
1346
|
+
childCount > 0 && metaInfo.push("".concat(childCount, " ").concat(folderLabel).toLowerCase());
|
|
1347
|
+
metaInfo.push("".concat(folder.itemCount || 0, " ").concat(itemLabel).toLowerCase());
|
|
1264
1348
|
return /*#__PURE__*/jsxs(Link, {
|
|
1265
1349
|
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",
|
|
1266
1350
|
to: link,
|
|
@@ -1335,7 +1419,6 @@ var FoldersList = function FoldersList(_ref) {
|
|
|
1335
1419
|
folder: folder,
|
|
1336
1420
|
onSelect: onSelect,
|
|
1337
1421
|
isSelected: selection.includes(folder.id),
|
|
1338
|
-
itemLabel: config.labels.item,
|
|
1339
1422
|
key: folder.id,
|
|
1340
1423
|
link: buildUrl(config.folderPath, _objectSpread$2(_objectSpread$2({}, params), {}, {
|
|
1341
1424
|
folderId: folder.sid
|
|
@@ -1466,7 +1549,7 @@ var FoldersTree = function FoldersTree(_ref) {
|
|
|
1466
1549
|
|
|
1467
1550
|
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}}
|
|
1468
1551
|
|
|
1469
|
-
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,
|
|
1552
|
+
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== */";
|
|
1470
1553
|
n(css,{});
|
|
1471
1554
|
|
|
1472
1555
|
export { FoldersContext, FoldersList, FoldersTree, MoveToFolderPane };
|