@bigbinary/neeto-folders-frontend 2.0.37 → 2.0.39

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.
Files changed (34) hide show
  1. package/dist/.ready +1 -1
  2. package/dist/cjs/components.js +47 -92
  3. package/dist/cjs/components.js.map +1 -1
  4. package/dist/cjs/hooks.js +3 -3
  5. package/dist/cjs/utils.js +3 -3
  6. package/dist/cjs/v2/components.js +1860 -0
  7. package/dist/cjs/v2/components.js.map +1 -0
  8. package/dist/components.js +36 -81
  9. package/dist/components.js.map +1 -1
  10. package/dist/hooks.js +3 -3
  11. package/dist/{index-BkzhP3-H.js → index-BfobK2xL.js} +2 -2
  12. package/dist/{index-BkzhP3-H.js.map → index-BfobK2xL.js.map} +1 -1
  13. package/dist/{index-Dn0REquw.js → index-BuO0HoGs.js} +2 -2
  14. package/dist/{index-Dn0REquw.js.map → index-BuO0HoGs.js.map} +1 -1
  15. package/dist/inject-css-Bkrn7lFS.js +77 -0
  16. package/dist/inject-css-Bkrn7lFS.js.map +1 -0
  17. package/dist/inject-css-D3Ee0dJK.js +82 -0
  18. package/dist/inject-css-D3Ee0dJK.js.map +1 -0
  19. package/dist/{internal-DKHdgJas.js → internal-DAkDv0P1.js} +3 -3
  20. package/dist/internal-DAkDv0P1.js.map +1 -0
  21. package/dist/{internal-DUPKoXC_.js → internal-UIifJzTd.js} +2 -2
  22. package/dist/internal-UIifJzTd.js.map +1 -0
  23. package/dist/{useFolderActions-B_2AW8DZ.js → useFolderActions-DCKQrv0G.js} +3 -2
  24. package/dist/useFolderActions-DCKQrv0G.js.map +1 -0
  25. package/dist/{useFolderActions-DHvX75jy.js → useFolderActions-DImaQ3gr.js} +3 -2
  26. package/dist/useFolderActions-DImaQ3gr.js.map +1 -0
  27. package/dist/utils.js +3 -3
  28. package/dist/v2/components.js +1851 -0
  29. package/dist/v2/components.js.map +1 -0
  30. package/package.json +27 -18
  31. package/dist/internal-DKHdgJas.js.map +0 -1
  32. package/dist/internal-DUPKoXC_.js.map +0 -1
  33. package/dist/useFolderActions-B_2AW8DZ.js.map +0 -1
  34. package/dist/useFolderActions-DHvX75jy.js.map +0 -1
@@ -0,0 +1,1860 @@
1
+ 'use strict';
2
+
3
+ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
4
+ var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
5
+ var shallow = require('zustand/shallow');
6
+ var neetoAtoms = require('@bigbinary/neeto-atoms');
7
+ var reactQuery = require('@tanstack/react-query');
8
+ var reactUtils = require('@bigbinary/neeto-commons-frontend/v2/react-utils');
9
+ var utils$1 = require('@bigbinary/neeto-commons-frontend/v2/utils');
10
+ var reactI18next = require('react-i18next');
11
+ var reactRouterDom = require('react-router-dom');
12
+ var useFolderActions = require('../../useFolderActions-DImaQ3gr.js');
13
+ var injectCss = require('../../inject-css-D3Ee0dJK.js');
14
+ var constants = require('../constants.js');
15
+ var utils = require('../../index-BuO0HoGs.js');
16
+ var internal = require('../../internal-DAkDv0P1.js');
17
+ var jsxRuntime = require('react/jsx-runtime');
18
+ var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
19
+ var React = require('react');
20
+ var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
21
+ var _regeneratorRuntime = require('@babel/runtime/regenerator');
22
+ var formik = require('@bigbinary/neeto-atoms/formik');
23
+ var i18next = require('i18next');
24
+ var yup = require('yup');
25
+ var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
26
+ var useHotkeys = require('@bigbinary/neeto-hotkeys');
27
+ var neetoCist = require('@bigbinary/neeto-cist');
28
+ var ramda = require('ramda');
29
+ var classNames = require('classnames');
30
+ var core = require('@dnd-kit/core');
31
+ var lucideReact = require('lucide-react');
32
+ var reactDom = require('react-dom');
33
+ var modifiers = require('@dnd-kit/modifiers');
34
+ var MoreDropdown = require('@bigbinary/neeto-molecules/v2/MoreDropdown');
35
+ var formik$1 = require('formik');
36
+ require('@bigbinary/neeto-commons-frontend/react-utils');
37
+ require('zustand');
38
+
39
+ function ownKeys$l(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; }
40
+ function _objectSpread$l(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$l(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
41
+ var FoldersAlerts = function FoldersAlerts(_ref) {
42
+ var config = _ref.config;
43
+ var _useFolderStore = useFolderActions.useFolderStore(function (store) {
44
+ return {
45
+ setFolderState: store["setFolderState"]
46
+ };
47
+ }, shallow.shallow),
48
+ setFolderState = _useFolderStore.setFolderState;
49
+ var queryParams = reactUtils.useQueryParams({
50
+ toCamelCase: false
51
+ });
52
+ var queryClient = reactQuery.useQueryClient();
53
+ var history = reactRouterDom.useHistory();
54
+ var _useTranslation = injectCss.useTranslation(config),
55
+ t = _useTranslation.t;
56
+ var _useFolderStore2 = useFolderActions.useFolderStore(function (store) {
57
+ var _store$alertState, _store$alertState2;
58
+ return {
59
+ type: (_store$alertState = store["alertState"]) === null || _store$alertState === void 0 ? void 0 : _store$alertState["type"],
60
+ item: (_store$alertState2 = store["alertState"]) === null || _store$alertState2 === void 0 ? void 0 : _store$alertState2["item"]
61
+ };
62
+ }, shallow.shallow),
63
+ type = _useFolderStore2.type,
64
+ item = _useFolderStore2.item;
65
+ var _useDestroyFolder = useFolderActions.useDestroyFolder(config),
66
+ destroyFolder = _useDestroyFolder.mutateAsync,
67
+ isPending = _useDestroyFolder.isPending;
68
+ var _useFolders = useFolderActions.useFolders(config),
69
+ folders = _useFolders.folders;
70
+ var onClose = function onClose() {
71
+ return setFolderState({
72
+ alertState: null
73
+ });
74
+ };
75
+ var alertProps = {
76
+ isOpen: !!type,
77
+ isSubmitting: isPending,
78
+ onClose: onClose
79
+ };
80
+ var onConfirmDelete = function onConfirmDelete() {
81
+ var onSuccess = function onSuccess() {
82
+ var _config$onUpdateSucce;
83
+ var isActive = internal.isActiveFolder(config, item.sid);
84
+ // Invalidates items and folder details. Refetch only if not active folder.
85
+ var invalidationKeys = [].concat(_toConsumableArray(config.invalidationKeys), [[constants.QUERY_KEYS.FOLDERS, config.type, constants.QUERY_KEYS.DETAILS]]);
86
+ invalidationKeys.forEach(function (queryKey) {
87
+ queryClient.invalidateQueries({
88
+ refetchType: isActive ? "none" : "active",
89
+ queryKey: queryKey
90
+ });
91
+ });
92
+ if (isActive && folders) {
93
+ var path = utils.pathToFolder(folders, item.id);
94
+ var parent = path[path.length - 2];
95
+ var redirectUrl = parent ? utils$1.buildUrl(config.folderPath, _objectSpread$l(_objectSpread$l({}, queryParams), {}, {
96
+ folderId: parent.sid
97
+ })) : "/";
98
+ history.replace(redirectUrl);
99
+ }
100
+ (_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
101
+ };
102
+ destroyFolder(item.id, {
103
+ onSuccess: onSuccess,
104
+ onSettled: onClose
105
+ });
106
+ };
107
+ if (type === "delete") {
108
+ alertProps.title = t("deleteFolder.title");
109
+ alertProps.message = /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
110
+ i18nKey: "deleteFolder.info",
111
+ values: item
112
+ });
113
+ if (config.customizeAlerts) config.customizeAlerts(type, item, alertProps);
114
+ alertProps.onSubmit = onConfirmDelete;
115
+ }
116
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Alert, _objectSpread$l({}, alertProps));
117
+ };
118
+
119
+ var FORM_VALIDATION_SCHEMA = yup.object().shape({
120
+ name: yup.string().required(i18next.t("errors.blank", {
121
+ entity: i18next.t("common.name")
122
+ }))
123
+ });
124
+
125
+ var _excluded$7 = ["type"];
126
+ function ownKeys$k(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; }
127
+ function _objectSpread$k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$k(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
128
+ var typeComponentMap = {
129
+ string: formik.Input,
130
+ "boolean": formik.Switch,
131
+ textarea: formik.Textarea
132
+ };
133
+ var ExtraAttributes = function ExtraAttributes(_ref) {
134
+ var attributes = _ref.attributes;
135
+ if (!Array.isArray(attributes)) return null;
136
+ return attributes.map(function (_ref2) {
137
+ var type = _ref2.type,
138
+ rest = _objectWithoutProperties(_ref2, _excluded$7);
139
+ var Component = typeComponentMap[type];
140
+ if (!Component) return null;
141
+ return /*#__PURE__*/React.createElement(Component, _objectSpread$k(_objectSpread$k({}, rest), {}, {
142
+ key: rest.name
143
+ }));
144
+ });
145
+ };
146
+
147
+ var createInitialValues = function createInitialValues(defaults, extraAttrs) {
148
+ var values = {
149
+ name: "",
150
+ parentId: defaults.parentId || null
151
+ };
152
+ extraAttrs === null || extraAttrs === void 0 || extraAttrs.forEach(function (_ref) {
153
+ var name = _ref.name,
154
+ defaultValue = _ref.defaultValue;
155
+ values[name] = defaultValue;
156
+ });
157
+ return values;
158
+ };
159
+ var createPayload = function createPayload(values, extraAttrs) {
160
+ var payload = {
161
+ name: values.name,
162
+ parentId: values.parentId || ""
163
+ };
164
+ extraAttrs === null || extraAttrs === void 0 || extraAttrs.forEach(function (_ref2) {
165
+ var name = _ref2.name;
166
+ payload[name] = values[name];
167
+ });
168
+ return payload;
169
+ };
170
+ var filterExtraAttributes = function filterExtraAttributes(attributes, isEditing) {
171
+ if (!attributes || !Array.isArray(attributes)) return [];
172
+ return attributes.filter(function (attribute) {
173
+ if (isEditing) {
174
+ return attribute.isEditAttribute !== false;
175
+ }
176
+ return attribute.isCreateAttribute !== false;
177
+ });
178
+ };
179
+
180
+ var AddEditPane = function AddEditPane(_ref) {
181
+ var _config$addEditValida;
182
+ var setFocusField = _ref.setFocusField,
183
+ config = _ref.config,
184
+ onClose = _ref.onClose,
185
+ folderSid = _ref.folderSid;
186
+ var _useTranslation = injectCss.useTranslation(config),
187
+ t = _useTranslation.t;
188
+ var _useFolderStore = useFolderActions.useFolderStore(function (store) {
189
+ var _store$paneState, _store$paneState2;
190
+ return {
191
+ type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"],
192
+ item: (_store$paneState2 = store["paneState"]) === null || _store$paneState2 === void 0 ? void 0 : _store$paneState2["item"]
193
+ };
194
+ }, shallow.shallow),
195
+ type = _useFolderStore.type,
196
+ item = _useFolderStore.item;
197
+ var _useFolderStore2 = useFolderActions.useFolderStore(function (store) {
198
+ return {
199
+ setFolderState: store["setFolderState"]
200
+ };
201
+ }, shallow.shallow),
202
+ setFolderState = _useFolderStore2.setFolderState;
203
+ var _useFetchFolders = useFolderActions.useFetchFolders(config),
204
+ isFetching = _useFetchFolders.isFetching;
205
+ var _useCreateFolder = useFolderActions.useCreateFolder(config),
206
+ createFolder = _useCreateFolder.mutate;
207
+ var _useUpdateFolder = useFolderActions.useUpdateFolder(config),
208
+ updateFolder = _useUpdateFolder.mutateAsync;
209
+ var isEditing = type === "edit" && item;
210
+ var activeFolderSid = folderSid || internal.getActiveFolderId(config);
211
+ var extraAttributes = config.extraAttributes;
212
+ var filteredExtraAttributes = React.useMemo(function () {
213
+ return filterExtraAttributes(extraAttributes, isEditing);
214
+ }, [extraAttributes, isEditing]);
215
+ var handleError = function handleError(setStatus, error) {
216
+ var response = error.response;
217
+ if (response && response.data && response.data.errors) {
218
+ setStatus(response.data.errors);
219
+ }
220
+ };
221
+ var onSubmitForm = /*#__PURE__*/function () {
222
+ var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(values, _ref2) {
223
+ var setStatus, payload, reactQueryOptions, config;
224
+ return _regeneratorRuntime.wrap(function _callee$(_context) {
225
+ while (1) switch (_context.prev = _context.next) {
226
+ case 0:
227
+ setStatus = _ref2.setStatus;
228
+ payload = createPayload(values, filteredExtraAttributes);
229
+ reactQueryOptions = {
230
+ onSuccess: function onSuccess(_ref4) {
231
+ var id = _ref4.id,
232
+ sid = _ref4.sid;
233
+ if (isEditing && sid !== item.sid) {
234
+ var newPath = window.location.pathname.replace(activeFolderSid, sid);
235
+ window.location.href = newPath;
236
+ } else if (!isEditing) {
237
+ setFolderState({
238
+ lastCreatedFolderId: id
239
+ });
240
+ }
241
+ utils$1.showThumbsUpToastr();
242
+ onClose();
243
+ },
244
+ onError: function onError(error) {
245
+ return handleError(setStatus, error);
246
+ }
247
+ };
248
+ config = {
249
+ showToastr: false
250
+ };
251
+ if (!isEditing) {
252
+ _context.next = 9;
253
+ break;
254
+ }
255
+ _context.next = 7;
256
+ return updateFolder({
257
+ id: item.id,
258
+ payload: payload,
259
+ config: config,
260
+ initialSlug: item.sid
261
+ }, reactQueryOptions);
262
+ case 7:
263
+ _context.next = 11;
264
+ break;
265
+ case 9:
266
+ _context.next = 11;
267
+ return createFolder({
268
+ payload: payload,
269
+ config: config
270
+ }, reactQueryOptions);
271
+ case 11:
272
+ case "end":
273
+ return _context.stop();
274
+ }
275
+ }, _callee);
276
+ }));
277
+ return function onSubmitForm(_x, _x2) {
278
+ return _ref3.apply(this, arguments);
279
+ };
280
+ }();
281
+ var initialValues = React.useMemo(function () {
282
+ return isEditing ? item : createInitialValues({}, filteredExtraAttributes);
283
+ }, [isEditing, item, filteredExtraAttributes]);
284
+ if (isFetching) {
285
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
286
+ className: "flex items-center justify-center",
287
+ children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Spinner, {})
288
+ });
289
+ }
290
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
291
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Header, {
292
+ children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Title, {
293
+ children: isEditing ? t("folders.edit") : t("folders.add")
294
+ })
295
+ }), /*#__PURE__*/jsxRuntime.jsx(formik.Form, {
296
+ className: "flex flex-grow flex-col",
297
+ formikProps: {
298
+ initialValues: initialValues,
299
+ enableReinitialize: true,
300
+ validationSchema: ((_config$addEditValida = config.addEditValidationSchema) === null || _config$addEditValida === void 0 ? void 0 : _config$addEditValida.call(config, isEditing)) || FORM_VALIDATION_SCHEMA,
301
+ onSubmit: onSubmitForm
302
+ },
303
+ children: function children(_ref5) {
304
+ var dirty = _ref5.dirty;
305
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
306
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
307
+ className: "pb-6",
308
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
309
+ className: "w-full space-y-5",
310
+ children: [/*#__PURE__*/jsxRuntime.jsx(formik.Input, {
311
+ required: true,
312
+ label: t("folders.name"),
313
+ name: "name",
314
+ ref: setFocusField
315
+ }), /*#__PURE__*/jsxRuntime.jsx(ExtraAttributes, {
316
+ attributes: filteredExtraAttributes
317
+ }), /*#__PURE__*/jsxRuntime.jsxs("div", {
318
+ children: [/*#__PURE__*/jsxRuntime.jsx(TreeSelect, {
319
+ config: config,
320
+ allowClear: true,
321
+ showSearch: true,
322
+ initialValue: folderSid,
323
+ label: t("createFolder.parentTitle"),
324
+ name: "parentId"
325
+ }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
326
+ className: "mt-1",
327
+ variant: "body3",
328
+ children: t("createFolder.parentInfo")
329
+ })]
330
+ })]
331
+ })
332
+ }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Footer, {
333
+ children: /*#__PURE__*/jsxRuntime.jsx(formik.ActionBlock, {
334
+ cancelButtonProps: {
335
+ onClick: onClose
336
+ },
337
+ submitButtonProps: {
338
+ disabled: !dirty
339
+ }
340
+ })
341
+ })]
342
+ });
343
+ }
344
+ })]
345
+ });
346
+ };
347
+
348
+ var _excluded$6 = ["icon", "itemLabel", "folder", "folderLabel", "depth", "hideTreeIndent", "className", "onClick"];
349
+ function ownKeys$j(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; }
350
+ function _objectSpread$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$j(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
351
+ var Node$1 = function Node(_ref, ref) {
352
+ var _folder$children$leng, _folder$children;
353
+ var _ref$icon = _ref.icon,
354
+ icon = _ref$icon === void 0 ? null : _ref$icon,
355
+ itemLabel = _ref.itemLabel,
356
+ folder = _ref.folder,
357
+ folderLabel = _ref.folderLabel,
358
+ depth = _ref.depth,
359
+ _ref$hideTreeIndent = _ref.hideTreeIndent,
360
+ hideTreeIndent = _ref$hideTreeIndent === void 0 ? false : _ref$hideTreeIndent,
361
+ className = _ref.className,
362
+ onClick = _ref.onClick,
363
+ rest = _objectWithoutProperties(_ref, _excluded$6);
364
+ var metaInfo = [];
365
+ 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;
366
+ childCount > 0 && metaInfo.push("".concat(childCount, " ").concat(folderLabel).toLowerCase());
367
+ folder.itemCount > 0 && metaInfo.push("".concat(folder.itemCount, " ").concat(itemLabel).toLowerCase());
368
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
369
+ className: "flex w-full min-w-0",
370
+ children: [!hideTreeIndent && Array.from({
371
+ length: depth + 1
372
+ }).map(function (_, index) {
373
+ return /*#__PURE__*/jsxRuntime.jsx("span", {
374
+ className: "border-border relative h-full flex-shrink-0 border-s",
375
+ style: {
376
+ width: injectCss.REORDER_TREE_INDENT_WIDTH,
377
+ insetInlineStart: Math.round(injectCss.REORDER_TREE_INDENT_WIDTH / 2)
378
+ },
379
+ children: index === depth && /*#__PURE__*/jsxRuntime.jsx("span", {
380
+ "aria-hidden": true,
381
+ className: "border-border absolute border-t",
382
+ style: {
383
+ insetInlineStart: 0,
384
+ top: "50%",
385
+ width: Math.round(injectCss.REORDER_TREE_INDENT_WIDTH / 2)
386
+ }
387
+ })
388
+ }, index);
389
+ }), /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread$j(_objectSpread$j({}, _objectSpread$j(_objectSpread$j({}, rest), {}, {
390
+ onClick: onClick,
391
+ ref: ref
392
+ })), {}, {
393
+ "data-testid": "".concat(neetoCist.hyphenate(folder.name), "-folder-node"),
394
+ className: classNames("relative my-1 flex cursor-pointer items-center px-2 py-1", className),
395
+ children: [icon, /*#__PURE__*/jsxRuntime.jsxs("div", {
396
+ className: "ms-2 flex items-baseline gap-2",
397
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
398
+ variant: "body1",
399
+ weight: "medium",
400
+ children: folder.name
401
+ }), metaInfo.length > 0 && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
402
+ className: "text-muted-foreground",
403
+ variant: "body3",
404
+ weight: "normal",
405
+ children: metaInfo.join(" . ")
406
+ })]
407
+ })]
408
+ }))]
409
+ });
410
+ };
411
+ var Node$2 = /*#__PURE__*/React.forwardRef(Node$1);
412
+
413
+ var _excluded$5 = ["folder", "item", "depth", "maxDepth", "disabled", "config"];
414
+ function ownKeys$i(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; }
415
+ function _objectSpread$i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$i(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
416
+ var _SelectableNode = function SelectableNode(_ref) {
417
+ var _folder$children$leng, _folder$children;
418
+ var folder = _ref.folder,
419
+ item = _ref.item,
420
+ _ref$depth = _ref.depth,
421
+ depth = _ref$depth === void 0 ? 0 : _ref$depth,
422
+ maxDepth = _ref.maxDepth,
423
+ disabled = _ref.disabled,
424
+ config = _ref.config,
425
+ rest = _objectWithoutProperties(_ref, _excluded$5);
426
+ var selection = rest.selection,
427
+ onSelect = rest.onSelect;
428
+ var _useTranslation = injectCss.useTranslation(config),
429
+ t = _useTranslation.t;
430
+ var isDisabled = disabled || (item === null || item === void 0 ? void 0 : item.id) === folder.id || depth >= maxDepth;
431
+ var itemLabel = config.labels[folder.itemCount > 1 ? "items" : "item"];
432
+ 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"];
433
+ var renderChildren = function renderChildren() {
434
+ if (neetoCist.isNotPresent(folder.children)) return null;
435
+ return folder.children.map(function (child) {
436
+ return /*#__PURE__*/React.createElement(_SelectableNode, _objectSpread$i(_objectSpread$i({}, _objectSpread$i(_objectSpread$i({}, rest), {}, {
437
+ config: config,
438
+ item: item,
439
+ maxDepth: maxDepth
440
+ })), {}, {
441
+ depth: depth + 1,
442
+ disabled: isDisabled,
443
+ folder: child,
444
+ key: child.id
445
+ }));
446
+ });
447
+ };
448
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
449
+ "aria-disabled": isDisabled,
450
+ title: isDisabled ? t("moveToFolder.notAllowed") : undefined,
451
+ className: classNames("flex flex-col w-full min-w-0", {
452
+ "opacity-60": isDisabled
453
+ }),
454
+ children: [/*#__PURE__*/jsxRuntime.jsx(Node$2, _objectSpread$i(_objectSpread$i({}, _objectSpread$i(_objectSpread$i({}, rest), {}, {
455
+ depth: depth,
456
+ folder: folder,
457
+ folderLabel: folderLabel,
458
+ itemLabel: itemLabel
459
+ })), {}, {
460
+ icon: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.RadioGroup.Item, {
461
+ readOnly: true,
462
+ checked: selection === folder.id,
463
+ "data-testid": "".concat(neetoCist.hyphenate(folder.name), "-folder-option"),
464
+ name: "move-folder-option"
465
+ }),
466
+ onClick: isDisabled ? neetoCist.noop : function () {
467
+ return onSelect(folder);
468
+ }
469
+ })), renderChildren()]
470
+ });
471
+ };
472
+
473
+ function ownKeys$h(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; }
474
+ function _objectSpread$h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
475
+ var createTree = function createTree(folders, isRootEnabled) {
476
+ return isRootEnabled ? [{
477
+ name: "/",
478
+ id: null,
479
+ children: folders
480
+ }] : folders;
481
+ };
482
+ var PaneBody = function PaneBody(_ref) {
483
+ var _ref$isRootEnabled = _ref.isRootEnabled,
484
+ isRootEnabled = _ref$isRootEnabled === void 0 ? true : _ref$isRootEnabled,
485
+ item = _ref.item,
486
+ config = _ref.config,
487
+ submitButtonProps = _ref.submitButtonProps,
488
+ cancelButtonProps = _ref.cancelButtonProps,
489
+ removeButtonProps = _ref.removeButtonProps,
490
+ onSubmit = _ref.onSubmit,
491
+ onClose = _ref.onClose,
492
+ onRemove = _ref.onRemove,
493
+ parentId = _ref.parentId;
494
+ var parent = (item === null || item === void 0 ? void 0 : item.parentId) || parentId || null;
495
+ var _useState = React.useState(parent),
496
+ _useState2 = _slicedToArray(_useState, 2),
497
+ selection = _useState2[0],
498
+ setSelection = _useState2[1];
499
+ var _useFolderStore = useFolderActions.useFolderStore(function (store) {
500
+ return {
501
+ setFolderState: store["setFolderState"]
502
+ };
503
+ }, shallow.shallow),
504
+ setFolderState = _useFolderStore.setFolderState;
505
+ var _useFetchFolders = useFolderActions.useFetchFolders(config),
506
+ _useFetchFolders$data = _useFetchFolders.data,
507
+ folders = _useFetchFolders$data === void 0 ? [] : _useFetchFolders$data,
508
+ isFetching = _useFetchFolders.isFetching;
509
+ var _useTranslation = injectCss.useTranslation(config),
510
+ t = _useTranslation.t;
511
+ var _useFolderStore2 = useFolderActions.useFolderStore(function (store) {
512
+ var _store$paneState;
513
+ return {
514
+ type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
515
+ };
516
+ }, shallow.shallow),
517
+ type = _useFolderStore2.type;
518
+ var tree = React.useMemo(function () {
519
+ return createTree(folders, isRootEnabled);
520
+ }, [folders, isRootEnabled]);
521
+ var maxDepth = Number.POSITIVE_INFINITY;
522
+ if (item) {
523
+ // If item is a folder, measure the current depth from current folder to longest leaf.
524
+ var foldersMap = utils.treeToMap(folders);
525
+ var folder = foldersMap[item.id];
526
+ if (folder) {
527
+ var folderDepth = utils.measureDepth(folder) + 1; // +1 for own depth;
528
+ maxDepth = config.maxDepth - folderDepth;
529
+ if (isRootEnabled) maxDepth += 1; // +1 for root folder.
530
+ }
531
+ }
532
+ var onAddFolder = function onAddFolder() {
533
+ setFolderState({
534
+ paneState: {
535
+ type: "add",
536
+ item: null
537
+ }
538
+ });
539
+ };
540
+ var _useFolderStore3 = useFolderActions.useFolderStore(function (store) {
541
+ var _store$lastCreatedFol;
542
+ return {
543
+ lastCreatedFolderId: (_store$lastCreatedFol = store["lastCreatedFolderId"]) === null || _store$lastCreatedFol === void 0 ? void 0 : _store$lastCreatedFol["lastCreatedFolderId"]
544
+ };
545
+ }, shallow.shallow),
546
+ lastCreatedFolderId = _useFolderStore3.lastCreatedFolderId;
547
+ React.useEffect(function () {
548
+ if (lastCreatedFolderId == null) return;
549
+ setSelection(lastCreatedFolderId);
550
+ setFolderState({
551
+ lastCreatedFolderId: null
552
+ });
553
+ }, [lastCreatedFolderId]);
554
+ useHotkeys(["command+enter", "enter"], function () {
555
+ return onSubmit(selection);
556
+ }, {
557
+ mode: "global",
558
+ enabled: !!type
559
+ });
560
+ if (isFetching) {
561
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
562
+ className: "flex items-center justify-center",
563
+ children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Spinner, {})
564
+ });
565
+ }
566
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
567
+ children: [/*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet.Header, {
568
+ className: "flex items-center justify-between",
569
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Title, {
570
+ children: t("moveToFolder.title")
571
+ }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
572
+ className: "me-2",
573
+ "data-testid": "add-new-folder-button",
574
+ label: t("folders.add"),
575
+ variant: "link",
576
+ onClick: onAddFolder
577
+ })]
578
+ }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
579
+ className: "pb-6",
580
+ children: tree.map(function (folder) {
581
+ return /*#__PURE__*/React.createElement(_SelectableNode, {
582
+ config: config,
583
+ folder: folder,
584
+ item: item,
585
+ maxDepth: maxDepth,
586
+ selection: selection,
587
+ disabled: (item === null || item === void 0 ? void 0 : item.id) === folder.id || maxDepth <= 0,
588
+ key: folder.id,
589
+ onSelect: function onSelect(folder) {
590
+ return setSelection(folder.id);
591
+ }
592
+ });
593
+ })
594
+ }), /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet.Footer, {
595
+ className: "space-x-2",
596
+ children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
597
+ className: "flex flex-1 space-x-2",
598
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, _objectSpread$h(_objectSpread$h({
599
+ label: t("common.save"),
600
+ variant: "default",
601
+ onClick: function onClick() {
602
+ return onSubmit(selection);
603
+ }
604
+ }, submitButtonProps), {}, {
605
+ "data-testid": "save-changes-button",
606
+ disabled: selection === parent || (submitButtonProps === null || submitButtonProps === void 0 ? void 0 : submitButtonProps.disabled)
607
+ })), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, _objectSpread$h(_objectSpread$h({
608
+ label: t("common.cancel"),
609
+ variant: "ghost",
610
+ onClick: onClose
611
+ }, cancelButtonProps), {}, {
612
+ "data-testid": "cancel-button"
613
+ }))]
614
+ }), onRemove && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, _objectSpread$h(_objectSpread$h({
615
+ label: t("moveToFolder.remove"),
616
+ variant: "outline",
617
+ onClick: onRemove
618
+ }, removeButtonProps), {}, {
619
+ "data-testid": "remove-from-folder-button"
620
+ }))]
621
+ })]
622
+ });
623
+ };
624
+
625
+ var MoveFolderPane = function MoveFolderPane(_ref) {
626
+ var config = _ref.config,
627
+ onClose = _ref.onClose;
628
+ var _useFolderStore = useFolderActions.useFolderStore(function (store) {
629
+ var _store$paneState;
630
+ return {
631
+ item: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["item"]
632
+ };
633
+ }, shallow.shallow),
634
+ item = _useFolderStore.item;
635
+ var _useUpdateFolder = useFolderActions.useUpdateFolder(config),
636
+ isPending = _useUpdateFolder.isPending,
637
+ updateFolder = _useUpdateFolder.mutate;
638
+ var onSaveSelection = function onSaveSelection(parentId) {
639
+ var payload = {
640
+ id: item.id,
641
+ parentId: parentId
642
+ };
643
+ updateFolder({
644
+ id: item.id,
645
+ payload: payload,
646
+ config: {
647
+ showToastr: false
648
+ }
649
+ }, {
650
+ onSuccess: function onSuccess() {
651
+ var _config$onUpdateSucce;
652
+ onClose();
653
+ (_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
654
+ },
655
+ onError: internal.toastApiError
656
+ });
657
+ };
658
+ return /*#__PURE__*/jsxRuntime.jsx(PaneBody, {
659
+ config: config,
660
+ item: item,
661
+ onClose: onClose,
662
+ submitButtonProps: {
663
+ loading: isPending,
664
+ disabled: isPending
665
+ },
666
+ onSubmit: onSaveSelection
667
+ });
668
+ };
669
+
670
+ var _excluded$4 = ["folder", "depth", "config", "folderLabel", "itemLabel"];
671
+ function ownKeys$g(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; }
672
+ function _objectSpread$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$g(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
673
+ var _DraggableNode$1 = function DraggableNode(_ref) {
674
+ var folder = _ref.folder,
675
+ _ref$depth = _ref.depth,
676
+ depth = _ref$depth === void 0 ? 0 : _ref$depth,
677
+ config = _ref.config,
678
+ folderLabel = _ref.folderLabel,
679
+ itemLabel = _ref.itemLabel,
680
+ rest = _objectWithoutProperties(_ref, _excluded$4);
681
+ var _useDraggable = core.useDraggable({
682
+ id: "draggable-item--".concat(folder.id),
683
+ data: folder,
684
+ disabled: depth <= 0
685
+ }),
686
+ isDragging = _useDraggable.isDragging,
687
+ attributes = _useDraggable.attributes,
688
+ listeners = _useDraggable.listeners,
689
+ setDraggableRef = _useDraggable.setNodeRef;
690
+ var _useDroppable = core.useDroppable({
691
+ id: "droppable-item--".concat(folder.id),
692
+ data: folder,
693
+ disabled: isDragging
694
+ }),
695
+ isOver = _useDroppable.isOver,
696
+ setDroppableRef = _useDroppable.setNodeRef;
697
+ var renderChildren = function renderChildren() {
698
+ if (neetoCist.isNotPresent(folder.children) || isDragging) return null;
699
+ return folder.children.map(function (child) {
700
+ var _child$children$lengt, _child$children;
701
+ return /*#__PURE__*/React.createElement(_DraggableNode$1, _objectSpread$g(_objectSpread$g({}, _objectSpread$g(_objectSpread$g({}, rest), {}, {
702
+ config: config
703
+ })), {}, {
704
+ depth: depth + 1,
705
+ folder: child,
706
+ itemLabel: config.labels[(child === null || child === void 0 ? void 0 : child.itemCount) > 1 ? "items" : "item"],
707
+ key: child.id,
708
+ 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"]
709
+ }));
710
+ });
711
+ };
712
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
713
+ children: [/*#__PURE__*/jsxRuntime.jsx(Node$2, _objectSpread$g(_objectSpread$g(_objectSpread$g({}, rest), {}, {
714
+ className: classNames({
715
+ "neeto-ui-rounded-lg hover:bg-muted w-full min-w-0 cursor-move transition-colors": true,
716
+ "bg-muted opacity-50": isDragging,
717
+ "border-primary border": isOver,
718
+ "border border-transparent": !isOver
719
+ })
720
+ }, _objectSpread$g(_objectSpread$g(_objectSpread$g({
721
+ depth: depth,
722
+ folder: folder
723
+ }, attributes), listeners), {}, {
724
+ folderLabel: folderLabel,
725
+ itemLabel: itemLabel
726
+ })), {}, {
727
+ ref: function ref(_ref2) {
728
+ setDroppableRef(_ref2);
729
+ setDraggableRef(_ref2);
730
+ }
731
+ })), renderChildren()]
732
+ });
733
+ };
734
+
735
+ function ownKeys$f(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; }
736
+ function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
737
+ var RearrangeFoldersPane = function RearrangeFoldersPane(_ref) {
738
+ var _tree$children$length, _tree$children, _dragItem$children$le, _dragItem$children;
739
+ var config = _ref.config,
740
+ onClose = _ref.onClose;
741
+ var _useState = React.useState(null),
742
+ _useState2 = _slicedToArray(_useState, 2),
743
+ dragItem = _useState2[0],
744
+ setDragItem = _useState2[1];
745
+ var _useState3 = React.useState({}),
746
+ _useState4 = _slicedToArray(_useState3, 2),
747
+ changes = _useState4[0],
748
+ setChanges = _useState4[1];
749
+ var _useTranslation = injectCss.useTranslation(config),
750
+ t = _useTranslation.t;
751
+ var _useFetchFolders = useFolderActions.useFetchFolders(config),
752
+ folders = _useFetchFolders.data,
753
+ isFetching = _useFetchFolders.isFetching;
754
+ var _useReorderFolders = useFolderActions.useReorderFolders(config),
755
+ reorderFolders = _useReorderFolders.mutate;
756
+ var _useFolderStore = useFolderActions.useFolderStore(function (store) {
757
+ var _store$paneState;
758
+ return {
759
+ type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
760
+ };
761
+ }, shallow.shallow),
762
+ type = _useFolderStore.type;
763
+ var _useStateWithDependen = reactUtils.useStateWithDependency(function () {
764
+ return {
765
+ name: "/",
766
+ id: null,
767
+ children: folders
768
+ };
769
+ }, [folders]),
770
+ _useStateWithDependen2 = _slicedToArray(_useStateWithDependen, 2),
771
+ tree = _useStateWithDependen2[0],
772
+ setTree = _useStateWithDependen2[1];
773
+ var onDragEnd = function onDragEnd(_ref2) {
774
+ var _activeFolder$meta$pa;
775
+ var active = _ref2.active,
776
+ over = _ref2.over;
777
+ setDragItem(null);
778
+ if (!over) return;
779
+ var foldersMap = utils.treeToMap(tree);
780
+ var activeFolder = foldersMap[active.data.current.id];
781
+ var overFolder = foldersMap[over.data.current.id];
782
+
783
+ // Check moving inside same directory
784
+ if (((_activeFolder$meta$pa = activeFolder.meta.parent) === null || _activeFolder$meta$pa === void 0 ? void 0 : _activeFolder$meta$pa.id) === overFolder.id) return;
785
+
786
+ // Check moving to a folder with depth greater than the allowed limit.
787
+ // maxDepth + 1 due to extra root node added for the tree
788
+ var activeDepth = utils.measureDepth(activeFolder);
789
+ var overDepth = overFolder.meta.depth;
790
+ if (activeDepth + overDepth >= config.maxDepth + 1) {
791
+ neetoAtoms.Toastr.error(t("moveToFolder.depthExceeded", {
792
+ maxDepth: config.maxDepth
793
+ }));
794
+ return;
795
+ }
796
+ activeFolder.meta.parent = overFolder;
797
+ var newTree = utils.mapToTree(foldersMap);
798
+ setTree(newTree);
799
+ setChanges(ramda.assoc(activeFolder.id, overFolder.id));
800
+ };
801
+ var onSubmit = function onSubmit() {
802
+ var payload = {
803
+ changes: changes
804
+ };
805
+ reorderFolders(payload, {
806
+ onSuccess: function onSuccess() {
807
+ var _config$onUpdateSucce;
808
+ onClose();
809
+ (_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
810
+ }
811
+ });
812
+ };
813
+ useHotkeys(["command+enter", "enter"], onSubmit, {
814
+ mode: "global",
815
+ enabled: !!type
816
+ });
817
+ var nodeProps = {
818
+ icon: /*#__PURE__*/jsxRuntime.jsx(lucideReact.GripVertical, {
819
+ className: "text-muted-foreground relative -start-[0.3125rem] flex-shrink-0"
820
+ })
821
+ };
822
+ if (isFetching) {
823
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
824
+ className: "flex items-center justify-center",
825
+ children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Spinner, {})
826
+ });
827
+ }
828
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
829
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Header, {
830
+ children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Title, {
831
+ children: t("reorderFolder.title")
832
+ })
833
+ }), /*#__PURE__*/jsxRuntime.jsxs(core.DndContext, {
834
+ onDragEnd: onDragEnd,
835
+ onDragStart: function onDragStart(_ref3) {
836
+ var active = _ref3.active;
837
+ return setDragItem(active.data.current);
838
+ },
839
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
840
+ className: "pb-6",
841
+ children: /*#__PURE__*/React.createElement(_DraggableNode$1, _objectSpread$f(_objectSpread$f({}, _objectSpread$f(_objectSpread$f({}, nodeProps), {}, {
842
+ config: config
843
+ })), {}, {
844
+ folder: tree,
845
+ itemLabel: config.labels[(tree === null || tree === void 0 ? void 0 : tree.itemCount) > 1 ? "items" : "item"],
846
+ key: tree.id,
847
+ 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"]
848
+ }))
849
+ }), /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet.Footer, {
850
+ className: "gap-2",
851
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
852
+ disabled: ramda.isEmpty(changes),
853
+ label: t("common.save"),
854
+ variant: "default",
855
+ onClick: onSubmit
856
+ }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
857
+ label: t("common.cancel"),
858
+ variant: "ghost",
859
+ onClick: onClose
860
+ })]
861
+ }), /*#__PURE__*/reactDom.createPortal(/*#__PURE__*/jsxRuntime.jsx(core.DragOverlay, {
862
+ zIndex: 99999,
863
+ children: dragItem && /*#__PURE__*/jsxRuntime.jsx(Node$2, _objectSpread$f(_objectSpread$f({
864
+ hideTreeIndent: true
865
+ }, nodeProps), {}, {
866
+ className: "bg-muted",
867
+ depth: 0,
868
+ folder: dragItem,
869
+ 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"],
870
+ itemLabel: config.labels[(dragItem === null || dragItem === void 0 ? void 0 : dragItem.itemCount) > 1 ? "items" : "item"]
871
+ }))
872
+ }), document.body)]
873
+ })]
874
+ });
875
+ };
876
+
877
+ var PlaceholderNode = function PlaceholderNode(_ref) {
878
+ var folder = _ref.folder,
879
+ dragState = _ref.dragState;
880
+ var overItem = dragState.overItem;
881
+ var id = React.useId();
882
+ var isOver = id === (overItem === null || overItem === void 0 ? void 0 : overItem.id);
883
+ var depth = folder.meta.depth + 1;
884
+ var meta = {
885
+ parent: folder,
886
+ index: -1,
887
+ depth: depth
888
+ };
889
+ var _useDroppable = core.useDroppable({
890
+ id: "droppable-placeholder--".concat(folder.name),
891
+ data: {
892
+ id: id,
893
+ meta: meta
894
+ }
895
+ }),
896
+ setDroppableRef = _useDroppable.setNodeRef;
897
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
898
+ className: "flex w-full",
899
+ children: [/*#__PURE__*/jsxRuntime.jsx("div", {
900
+ style: {
901
+ width: injectCss.REORDER_TREE_INDENT_WIDTH * (depth + 1)
902
+ }
903
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
904
+ ref: setDroppableRef,
905
+ className: classNames({
906
+ "min-w-0 flex-1 transition-colors": true,
907
+ "border-primary border-b-2": isOver
908
+ })
909
+ })]
910
+ });
911
+ };
912
+
913
+ var _excluded$3 = ["folder", "config", "dragState", "folderLabel", "itemLabel"];
914
+ function ownKeys$e(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; }
915
+ function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
916
+ var _DraggableNode = function DraggableNode(_ref) {
917
+ var _overItem$meta$parent;
918
+ var folder = _ref.folder,
919
+ config = _ref.config,
920
+ dragState = _ref.dragState,
921
+ folderLabel = _ref.folderLabel,
922
+ itemLabel = _ref.itemLabel,
923
+ rest = _objectWithoutProperties(_ref, _excluded$3);
924
+ var overItem = dragState.overItem;
925
+ var isOverItem = folder.id === (overItem === null || overItem === void 0 ? void 0 : overItem.id);
926
+ var isOverParent = folder.id === (overItem === null || overItem === void 0 || (_overItem$meta$parent = overItem.meta.parent) === null || _overItem$meta$parent === void 0 ? void 0 : _overItem$meta$parent.id);
927
+ var isRoot = folder.meta.depth <= 0;
928
+ var _useDraggable = core.useDraggable({
929
+ id: "draggable-item--".concat(folder.id),
930
+ data: folder,
931
+ disabled: isRoot
932
+ }),
933
+ isDragging = _useDraggable.isDragging,
934
+ attributes = _useDraggable.attributes,
935
+ listeners = _useDraggable.listeners,
936
+ setDraggableRef = _useDraggable.setNodeRef;
937
+ var _useDroppable = core.useDroppable({
938
+ id: "droppable-item--".concat(folder.id),
939
+ data: folder,
940
+ disabled: isRoot || isDragging
941
+ }),
942
+ setDroppableRef = _useDroppable.setNodeRef;
943
+ var renderChildren = function renderChildren() {
944
+ if (isDragging) return null;
945
+ return /*#__PURE__*/jsxRuntime.jsxs(React.Fragment, {
946
+ children: [/*#__PURE__*/jsxRuntime.jsx(PlaceholderNode, {
947
+ dragState: dragState,
948
+ folder: folder
949
+ }), internal.isArray(folder.children) && folder.children.map(function (child) {
950
+ var _child$children$lengt, _child$children;
951
+ return /*#__PURE__*/React.createElement(_DraggableNode, _objectSpread$e(_objectSpread$e({}, _objectSpread$e(_objectSpread$e({}, rest), {}, {
952
+ config: config,
953
+ dragState: dragState
954
+ })), {}, {
955
+ depth: child.meta.depth,
956
+ folder: child,
957
+ itemLabel: config.labels[(child === null || child === void 0 ? void 0 : child.itemCount) > 1 ? "items" : "item"],
958
+ key: child.id,
959
+ 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"]
960
+ }));
961
+ })]
962
+ }, "".concat(folder.id, "--container"));
963
+ };
964
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
965
+ children: [/*#__PURE__*/jsxRuntime.jsx(Node$2, _objectSpread$e(_objectSpread$e({
966
+ depth: folder.meta.depth
967
+ }, _objectSpread$e(_objectSpread$e(_objectSpread$e(_objectSpread$e({}, rest), {}, {
968
+ folder: folder
969
+ }, attributes), listeners), {}, {
970
+ folderLabel: folderLabel,
971
+ itemLabel: itemLabel
972
+ })), {}, {
973
+ className: classNames({
974
+ "hover:bg-muted w-full cursor-move transition-colors": true,
975
+ "bg-muted opacity-50": isDragging,
976
+ "bg-accent": isOverParent,
977
+ "border-primary border-b-2": isOverItem
978
+ }),
979
+ ref: function ref(_ref2) {
980
+ setDroppableRef(_ref2);
981
+ setDraggableRef(_ref2);
982
+ }
983
+ })), renderChildren()]
984
+ });
985
+ };
986
+
987
+ function ownKeys$d(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; }
988
+ function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
989
+ var initialDragState = {
990
+ activeItem: null,
991
+ overItem: null
992
+ };
993
+ var sensorConfig$1 = {
994
+ activationConstraint: {
995
+ distance: 8
996
+ }
997
+ };
998
+ var measuringConfig = {
999
+ droppable: {
1000
+ frequency: 500
1001
+ }
1002
+ };
1003
+
1004
+ // Reorder with support for position adjustment
1005
+ var ReorderFoldersPane = function ReorderFoldersPane(_ref) {
1006
+ var _tree$children$length, _tree$children, _dragState$activeItem, _dragState$activeItem2, _dragState$activeItem3;
1007
+ var config = _ref.config,
1008
+ onClose = _ref.onClose;
1009
+ var _useState = React.useState(initialDragState),
1010
+ _useState2 = _slicedToArray(_useState, 2),
1011
+ dragState = _useState2[0],
1012
+ setDragState = _useState2[1];
1013
+ var _useState3 = React.useState({}),
1014
+ _useState4 = _slicedToArray(_useState3, 2),
1015
+ changes = _useState4[0],
1016
+ setChanges = _useState4[1];
1017
+ var _useTranslation = injectCss.useTranslation(config),
1018
+ t = _useTranslation.t;
1019
+ var _useFetchFolders = useFolderActions.useFetchFolders(config),
1020
+ folders = _useFetchFolders.data,
1021
+ isFetching = _useFetchFolders.isFetching;
1022
+ var _useReorderFolders = useFolderActions.useReorderFolders(config),
1023
+ reorderFolders = _useReorderFolders.mutate;
1024
+ var sensors = core.useSensors(core.useSensor(core.PointerSensor, sensorConfig$1));
1025
+ var _useFolderStore = useFolderActions.useFolderStore(function (store) {
1026
+ var _store$paneState;
1027
+ return {
1028
+ type: (_store$paneState = store["paneState"]) === null || _store$paneState === void 0 ? void 0 : _store$paneState["type"]
1029
+ };
1030
+ }, shallow.shallow),
1031
+ type = _useFolderStore.type;
1032
+ var _useStateWithDependen = reactUtils.useStateWithDependency(function () {
1033
+ return {
1034
+ name: "/",
1035
+ id: null,
1036
+ children: folders
1037
+ };
1038
+ }, [folders]),
1039
+ _useStateWithDependen2 = _slicedToArray(_useStateWithDependen, 2),
1040
+ baseTree = _useStateWithDependen2[0],
1041
+ setBaseTree = _useStateWithDependen2[1];
1042
+
1043
+ // Decorates tree with meta info. Can be optimized when needed.
1044
+ var tree = React.useMemo(function () {
1045
+ return utils.mapToSortedTree(utils.treeToMap(baseTree));
1046
+ }, [baseTree]);
1047
+ var onDragEnd = function onDragEnd(_ref2) {
1048
+ var active = _ref2.active,
1049
+ over = _ref2.over;
1050
+ setDragState(initialDragState);
1051
+ if (!over) return;
1052
+ var foldersMap = utils.treeToMap(tree);
1053
+ var activeFolder = foldersMap[active.data.current.id];
1054
+ var targetFolder = foldersMap[over.data.current.meta.parent.id];
1055
+ var targetIndex = over.data.current.meta.index + 1; // `index` starts from -1 with placeholder
1056
+
1057
+ // Guards: Check moving inside invalid directories.
1058
+ if (!targetFolder || activeFolder.id === targetFolder.id) return;
1059
+ if (activeFolder.meta.parent.id === targetFolder.id && activeFolder.meta.index === targetIndex) {
1060
+ return;
1061
+ }
1062
+
1063
+ // Check moving to a folder with depth greater than the allowed limit.
1064
+ // maxDepth + 1 due to extra root node added for the tree
1065
+ var srcDepth = utils.measureDepth(activeFolder);
1066
+ var dstDepth = targetFolder.meta.depth;
1067
+ if (srcDepth + dstDepth >= config.maxDepth + 1) {
1068
+ neetoAtoms.Toastr.error(t("moveToFolder.depthExceeded", {
1069
+ maxDepth: config.maxDepth
1070
+ }));
1071
+ return;
1072
+ }
1073
+ activeFolder.meta.parent = targetFolder;
1074
+ activeFolder.meta.__index = targetIndex;
1075
+ var newTree = utils.mapToSortedTree(foldersMap);
1076
+ setBaseTree(newTree);
1077
+ setChanges(ramda.assoc(activeFolder.id, {
1078
+ parentId: targetFolder.id,
1079
+ index: targetIndex
1080
+ }));
1081
+ };
1082
+ var onSubmit = function onSubmit() {
1083
+ var payload = {
1084
+ changes: changes
1085
+ };
1086
+ reorderFolders(payload, {
1087
+ onSuccess: function onSuccess() {
1088
+ var _config$onUpdateSucce;
1089
+ onClose();
1090
+ (_config$onUpdateSucce = config.onUpdateSuccess) === null || _config$onUpdateSucce === void 0 || _config$onUpdateSucce.call(config);
1091
+ }
1092
+ });
1093
+ };
1094
+ useHotkeys(["command+enter", "enter"], onSubmit, {
1095
+ mode: "global",
1096
+ enabled: !!type
1097
+ });
1098
+ var nodeProps = {
1099
+ icon: /*#__PURE__*/jsxRuntime.jsx(lucideReact.GripVertical, {
1100
+ className: "text-muted-foreground relative -start-[0.3125rem] flex-shrink-0"
1101
+ })
1102
+ };
1103
+ if (isFetching) {
1104
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
1105
+ className: "flex items-center justify-center",
1106
+ children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Spinner, {})
1107
+ });
1108
+ }
1109
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
1110
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Header, {
1111
+ children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Title, {
1112
+ children: t("reorderFolder.title")
1113
+ })
1114
+ }), /*#__PURE__*/jsxRuntime.jsxs(core.DndContext, {
1115
+ onDragEnd: onDragEnd,
1116
+ sensors: sensors,
1117
+ collisionDetection: injectCss.closestCenter(dragState),
1118
+ measuring: measuringConfig,
1119
+ onDragOver: function onDragOver(_ref3) {
1120
+ var over = _ref3.over;
1121
+ setDragState(ramda.assoc("overItem", over === null || over === void 0 ? void 0 : over.data.current));
1122
+ },
1123
+ onDragStart: function onDragStart(_ref4) {
1124
+ var active = _ref4.active;
1125
+ setDragState(ramda.assoc("activeItem", active.data.current));
1126
+ },
1127
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
1128
+ className: "pb-6",
1129
+ children: /*#__PURE__*/React.createElement(_DraggableNode, _objectSpread$d(_objectSpread$d({}, _objectSpread$d(_objectSpread$d({}, nodeProps), {}, {
1130
+ config: config,
1131
+ dragState: dragState
1132
+ })), {}, {
1133
+ folder: tree,
1134
+ itemLabel: config.labels[(tree === null || tree === void 0 ? void 0 : tree.itemCount) > 1 ? "items" : "item"],
1135
+ key: tree.id,
1136
+ 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"]
1137
+ }))
1138
+ }), /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet.Footer, {
1139
+ className: "gap-2",
1140
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
1141
+ disabled: ramda.isEmpty(changes),
1142
+ label: t("common.save"),
1143
+ variant: "default",
1144
+ onClick: onSubmit
1145
+ }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
1146
+ label: t("common.cancel"),
1147
+ variant: "ghost",
1148
+ onClick: onClose
1149
+ })]
1150
+ }), /*#__PURE__*/reactDom.createPortal(/*#__PURE__*/jsxRuntime.jsx(core.DragOverlay, {
1151
+ zIndex: 99999,
1152
+ children: dragState && /*#__PURE__*/jsxRuntime.jsx(Node$2, _objectSpread$d(_objectSpread$d({
1153
+ hideTreeIndent: true
1154
+ }, nodeProps), {}, {
1155
+ className: "bg-muted ps-4 pe-12",
1156
+ depth: 0,
1157
+ folder: dragState.activeItem,
1158
+ 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"],
1159
+ itemLabel: config.labels[((_dragState$activeItem3 = dragState.activeItem) === null || _dragState$activeItem3 === void 0 ? void 0 : _dragState$activeItem3.itemCount) > 1 ? "items" : "item"]
1160
+ }))
1161
+ }), document.body)]
1162
+ })]
1163
+ });
1164
+ };
1165
+
1166
+ var _excluded$2 = ["type"];
1167
+ function ownKeys$c(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; }
1168
+ function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$c(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1169
+ var FoldersPane = function FoldersPane(_ref) {
1170
+ var configProps = _ref.config;
1171
+ var config = _objectSpread$c(_objectSpread$c({}, useFolderActions.DEFAULT_CONFIG), configProps);
1172
+ var setFocusField = React.useRef(null);
1173
+ var _useFolderStore = useFolderActions.useFolderStore(function (store) {
1174
+ return {
1175
+ paneState: store["paneState"],
1176
+ setFolderState: store["setFolderState"]
1177
+ };
1178
+ }, shallow.shallow),
1179
+ paneState = _useFolderStore.paneState,
1180
+ setFolderState = _useFolderStore.setFolderState;
1181
+ var _ref2 = paneState || {},
1182
+ type = _ref2.type,
1183
+ rest = _objectWithoutProperties(_ref2, _excluded$2);
1184
+ var onClose = function onClose() {
1185
+ return setFolderState({
1186
+ paneState: null
1187
+ });
1188
+ };
1189
+ var commonProps = _objectSpread$c({
1190
+ config: config,
1191
+ onClose: onClose
1192
+ }, rest);
1193
+ var ReorderPaneComponent = config.reorderMode === "reorder" ? ReorderFoldersPane : RearrangeFoldersPane;
1194
+ return /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet, {
1195
+ onClose: onClose,
1196
+ initialFocusRef: setFocusField,
1197
+ isOpen: !!type,
1198
+ children: [(type === "edit" || type === "add") && /*#__PURE__*/jsxRuntime.jsx(AddEditPane, _objectSpread$c({}, _objectSpread$c({
1199
+ setFocusField: setFocusField
1200
+ }, commonProps))), type === "move" && /*#__PURE__*/jsxRuntime.jsx(MoveFolderPane, _objectSpread$c({}, commonProps)), type === "reorder" && /*#__PURE__*/jsxRuntime.jsx(ReorderPaneComponent, _objectSpread$c({}, commonProps))]
1201
+ });
1202
+ };
1203
+
1204
+ var FoldersContext = function FoldersContext(_ref) {
1205
+ var config = _ref.config,
1206
+ children = _ref.children;
1207
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
1208
+ children: [children, /*#__PURE__*/jsxRuntime.jsx(FoldersPane, {
1209
+ config: config
1210
+ }), /*#__PURE__*/jsxRuntime.jsx(FoldersAlerts, {
1211
+ config: config
1212
+ })]
1213
+ });
1214
+ };
1215
+
1216
+ function ownKeys$b(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; }
1217
+ function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1218
+ var FolderTile = function FolderTile(_ref) {
1219
+ var _folder$children$leng, _folder$children, _folder$children$leng2, _folder$children2;
1220
+ var _ref$isPreview = _ref.isPreview,
1221
+ isPreview = _ref$isPreview === void 0 ? false : _ref$isPreview,
1222
+ isSelected = _ref.isSelected,
1223
+ link = _ref.link,
1224
+ folder = _ref.folder,
1225
+ actions = _ref.actions,
1226
+ config = _ref.config,
1227
+ onSelect = _ref.onSelect;
1228
+ var _useTranslation = injectCss.useTranslation(config),
1229
+ t = _useTranslation.t;
1230
+ var droppable = core.useDroppable({
1231
+ id: "droppable-item--".concat(folder.id),
1232
+ data: folder,
1233
+ disabled: isPreview
1234
+ });
1235
+ var draggable = core.useDraggable({
1236
+ id: "draggable-item--".concat(folder.id),
1237
+ data: _objectSpread$b(_objectSpread$b({}, folder), {}, {
1238
+ type: useFolderActions.DEFAULT_CONFIG.type
1239
+ }),
1240
+ disabled: isPreview
1241
+ });
1242
+ var actionCallback = function actionCallback(callback) {
1243
+ return function (event) {
1244
+ event.preventDefault();
1245
+ callback(folder);
1246
+ };
1247
+ };
1248
+ var menuItems = [{
1249
+ key: "edit",
1250
+ label: t("common.edit"),
1251
+ onClick: actionCallback(actions.onEdit)
1252
+ }, {
1253
+ key: "move",
1254
+ label: t("common.moveToFolder"),
1255
+ onClick: actionCallback(actions.onMove)
1256
+ }, {
1257
+ key: "delete",
1258
+ label: t("common.delete"),
1259
+ onClick: actionCallback(actions.onDelete)
1260
+ }];
1261
+ var metaInfo = [];
1262
+ 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;
1263
+ var itemLabel = config.labels[folder.itemCount > 1 ? "items" : "item"];
1264
+ 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"];
1265
+ childCount > 0 && metaInfo.push("".concat(childCount, " ").concat(folderLabel).toLowerCase());
1266
+ metaInfo.push("".concat(folder.itemCount || 0, " ").concat(itemLabel).toLowerCase());
1267
+ return /*#__PURE__*/jsxRuntime.jsxs(reactRouterDom.Link, _objectSpread$b(_objectSpread$b(_objectSpread$b(_objectSpread$b(_objectSpread$b({
1268
+ "data-testid": "".concat(neetoCist.hyphenate(folder.name), "-folder-tile"),
1269
+ to: link,
1270
+ className: classNames("bg-muted border-border neeto-ui-rounded-md hover:border-primary relative flex max-w-full items-start gap-2 border-2 p-3 transition-colors ease-in", {
1271
+ "bg-accent": droppable.isOver,
1272
+ "opacity-50": draggable.isDragging,
1273
+ "scale-75": isPreview
1274
+ })
1275
+ }, droppable.attributes), droppable.listeners), draggable.attributes), draggable.listeners), {}, {
1276
+ ref: function ref(_ref2) {
1277
+ droppable.setNodeRef(_ref2);
1278
+ draggable.setNodeRef(_ref2);
1279
+ },
1280
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Checkbox, {
1281
+ checked: isSelected,
1282
+ className: "m-0 flex-shrink-0 flex-grow-0 pt-0.5",
1283
+ name: folder.id,
1284
+ onCheckedChange: function onCheckedChange(checked) {
1285
+ return onSelect(folder, checked);
1286
+ },
1287
+ onClick: function onClick(event) {
1288
+ return event.stopPropagation();
1289
+ }
1290
+ }), /*#__PURE__*/jsxRuntime.jsxs("span", {
1291
+ className: "flex min-w-0 flex-grow flex-col gap-2",
1292
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
1293
+ className: "-mt-0.5 line-clamp-2 break-words pe-8",
1294
+ "data-testid": "folder-name",
1295
+ title: folder.name,
1296
+ variant: "body1",
1297
+ weight: "medium",
1298
+ children: folder.name
1299
+ }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
1300
+ className: "text-muted-foreground",
1301
+ variant: "body3",
1302
+ children: metaInfo.join(" . ")
1303
+ })]
1304
+ }), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown, {
1305
+ menuItems: menuItems,
1306
+ dropdownButtonProps: {
1307
+ className: "absolute end-2 top-2"
1308
+ },
1309
+ dropdownProps: {
1310
+ onClick: function onClick(event) {
1311
+ return event.preventDefault();
1312
+ }
1313
+ }
1314
+ })]
1315
+ }));
1316
+ };
1317
+
1318
+ var sensorConfig = {
1319
+ activationConstraint: {
1320
+ distance: 8
1321
+ }
1322
+ };
1323
+ var FoldersDnd = function FoldersDnd(_ref) {
1324
+ var config = _ref.config,
1325
+ children = _ref.children,
1326
+ onDropItem = _ref.onDrop,
1327
+ renderItemOverlay = _ref.renderOverlay;
1328
+ var _useState = React.useState(null),
1329
+ _useState2 = _slicedToArray(_useState, 2),
1330
+ dragItem = _useState2[0],
1331
+ setDragItem = _useState2[1];
1332
+ var _useUpdateFolder = useFolderActions.useUpdateFolder(config),
1333
+ updateFolder = _useUpdateFolder.mutate;
1334
+ var sensors = core.useSensors(core.useSensor(core.PointerSensor, sensorConfig));
1335
+ var onDropFolder = function onDropFolder(folder, parent) {
1336
+ if (!folder || !parent || folder.id === parent.id) return;
1337
+ updateFolder({
1338
+ id: folder.id,
1339
+ payload: {
1340
+ id: folder.id,
1341
+ parentId: parent.id
1342
+ },
1343
+ initialSlug: folder.sid,
1344
+ config: {
1345
+ showToastr: false
1346
+ }
1347
+ }, {
1348
+ onError: internal.toastApiError
1349
+ });
1350
+ };
1351
+ var handleDragStart = function handleDragStart(_ref2) {
1352
+ var active = _ref2.active;
1353
+ setDragItem(active.data.current);
1354
+ };
1355
+ var handleDragEnd = function handleDragEnd(_ref3) {
1356
+ var active = _ref3.active,
1357
+ over = _ref3.over;
1358
+ setDragItem(null);
1359
+ if (!active || !over) return;
1360
+ if (active.data.current.type === useFolderActions.DEFAULT_CONFIG.type) {
1361
+ onDropFolder(active.data.current, over.data.current);
1362
+ } else onDropItem(active.data.current, over.data.current);
1363
+ };
1364
+ var renderFolderOverlay = function renderFolderOverlay(dragItem) {
1365
+ return /*#__PURE__*/jsxRuntime.jsx(FolderTile, {
1366
+ config: config,
1367
+ isPreview: true,
1368
+ actions: {},
1369
+ folder: dragItem,
1370
+ onSelect: neetoCist.noop
1371
+ });
1372
+ };
1373
+ return /*#__PURE__*/jsxRuntime.jsxs(core.DndContext, {
1374
+ sensors: sensors,
1375
+ onDragEnd: handleDragEnd,
1376
+ onDragStart: handleDragStart,
1377
+ children: [children, /*#__PURE__*/jsxRuntime.jsx(core.DragOverlay, {
1378
+ dropAnimation: null,
1379
+ modifiers: [modifiers.snapCenterToCursor],
1380
+ children: dragItem && (dragItem.type !== useFolderActions.DEFAULT_CONFIG.type ? renderItemOverlay(dragItem) : renderFolderOverlay(dragItem))
1381
+ })]
1382
+ });
1383
+ };
1384
+
1385
+ 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; }
1386
+ 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), true).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; }
1387
+ var FoldersList = function FoldersList(_ref) {
1388
+ var _ref$selection = _ref.selection,
1389
+ selection = _ref$selection === void 0 ? [] : _ref$selection,
1390
+ configProps = _ref.config,
1391
+ onSelect = _ref.onSelect;
1392
+ var config = _objectSpread$a(_objectSpread$a({}, useFolderActions.DEFAULT_CONFIG), configProps);
1393
+ var params = reactUtils.useQueryParams();
1394
+ var _useTranslation = injectCss.useTranslation(config),
1395
+ t = _useTranslation.t;
1396
+ var _useFolders = useFolderActions.useFolders(config),
1397
+ folders = _useFolders.folders;
1398
+ var _useFolder = useFolderActions.useFolder(config),
1399
+ folderId = _useFolder.folderId,
1400
+ folder = _useFolder.folder;
1401
+ var actions = useFolderActions.useFolderActions(config);
1402
+ var subFolders = folderId ? folder === null || folder === void 0 ? void 0 : folder.children : folders;
1403
+ if (neetoCist.isNotPresent(subFolders) || !Array.isArray(subFolders)) return null;
1404
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
1405
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
1406
+ className: "my-3",
1407
+ variant: "h4",
1408
+ children: t("folders.title")
1409
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
1410
+ className: "neeto-folders-grid-view-wrapper mb-10 grid w-full gap-4",
1411
+ "data-testid": "folders-list",
1412
+ children: subFolders.map(function (folder) {
1413
+ return /*#__PURE__*/React.createElement(FolderTile, {
1414
+ actions: actions,
1415
+ config: config,
1416
+ folder: folder,
1417
+ onSelect: onSelect,
1418
+ isSelected: selection.includes(folder.id),
1419
+ key: folder.id,
1420
+ link: utils$1.buildUrl(config.folderPath, _objectSpread$a(_objectSpread$a({}, params), {}, {
1421
+ folderId: folder.sid
1422
+ }))
1423
+ });
1424
+ })
1425
+ })]
1426
+ });
1427
+ };
1428
+
1429
+ 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; }
1430
+ 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), true).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; }
1431
+ var DraggableWrapper = function DraggableWrapper(_ref) {
1432
+ var data = _ref.data,
1433
+ _ref$id = _ref.id,
1434
+ id = _ref$id === void 0 ? data.id : _ref$id,
1435
+ children = _ref.children;
1436
+ var draggable = core.useDraggable({
1437
+ id: "folders-list-draggable-item--".concat(id),
1438
+ data: data
1439
+ });
1440
+ return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread$9(_objectSpread$9(_objectSpread$9({
1441
+ className: classNames({
1442
+ "opacity-50": draggable.isDragging
1443
+ })
1444
+ }, draggable.attributes), draggable.listeners), {}, {
1445
+ ref: draggable.setNodeRef,
1446
+ children: children
1447
+ }));
1448
+ };
1449
+
1450
+ var _excluded$1 = ["isOpen", "onClose"];
1451
+ function ownKeys$8(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; }
1452
+ function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1453
+ var MoveToFolderPane = function MoveToFolderPane(_ref) {
1454
+ var isOpen = _ref.isOpen,
1455
+ onClose = _ref.onClose,
1456
+ rest = _objectWithoutProperties(_ref, _excluded$1);
1457
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet, {
1458
+ isOpen: isOpen,
1459
+ onClose: onClose,
1460
+ children: /*#__PURE__*/jsxRuntime.jsx(PaneBody, _objectSpread$8({}, _objectSpread$8(_objectSpread$8({}, rest), {}, {
1461
+ onClose: onClose
1462
+ })))
1463
+ });
1464
+ };
1465
+
1466
+ 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; }
1467
+ 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), true).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; }
1468
+ var FolderIcon = function FolderIcon(props) {
1469
+ return /*#__PURE__*/jsxRuntime.jsx("svg", _objectSpread$7(_objectSpread$7({
1470
+ fill: "none",
1471
+ height: props.size,
1472
+ viewBox: "0 0 16 16",
1473
+ width: props.size,
1474
+ xmlns: "http://www.w3.org/2000/svg"
1475
+ }, props), {}, {
1476
+ children: /*#__PURE__*/jsxRuntime.jsx("path", {
1477
+ d: "M3.202 12.798h9.6c.882 0 1.6-.717 1.6-1.6v-6c0-.882-.718-1.6-1.6-1.6H9.069a.8.8 0 0 1-.48-.16l-.96-.72a1.6 1.6 0 0 0-.96-.32H3.202c-.883 0-1.6.718-1.6 1.6v7.2c0 .883.717 1.6 1.6 1.6",
1478
+ fill: "currentColor"
1479
+ })
1480
+ }));
1481
+ };
1482
+
1483
+ 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; }
1484
+ 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), true).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; }
1485
+ var FolderIconOpen = function FolderIconOpen(props) {
1486
+ return /*#__PURE__*/jsxRuntime.jsx("svg", _objectSpread$6(_objectSpread$6({
1487
+ fill: "none",
1488
+ height: props.size,
1489
+ viewBox: "0 0 16 16",
1490
+ width: props.size,
1491
+ xmlns: "http://www.w3.org/2000/svg"
1492
+ }, props), {}, {
1493
+ children: /*#__PURE__*/jsxRuntime.jsx("path", {
1494
+ d: "m2.2 7.24-.59 1.765V4c0-.882.717-1.6 1.6-1.6h3.467c.345 0 .682.113.96.32l.96.72c.137.105.307.16.48.16h2.932c.883 0 1.6.718 1.6 1.6v.4H4.474c-1.032 0-1.95.66-2.277 1.64zm10.544 5.56h-9.47c-.82 0-1.397-.802-1.137-1.58l1.2-3.6c.162-.49.622-.82 1.137-.82h9.47c.82 0 1.398.803 1.138 1.58l-1.2 3.6c-.163.49-.623.82-1.138.82",
1495
+ fill: "currentColor"
1496
+ })
1497
+ }));
1498
+ };
1499
+
1500
+ var Node = function Node(_ref) {
1501
+ var _isActive = _ref.isActive,
1502
+ isExpanded = _ref.isExpanded,
1503
+ node = _ref.node,
1504
+ link = _ref.link,
1505
+ config = _ref.config;
1506
+ var _useTranslation = injectCss.useTranslation(),
1507
+ t = _useTranslation.t;
1508
+ var isPrivate = node.isPrivate,
1509
+ name = node.name,
1510
+ _node$isFolder = node.isFolder,
1511
+ isFolder = _node$isFolder === void 0 ? true : _node$isFolder;
1512
+ var _ref2 = isFolder ? config.folderActions : config.itemActions,
1513
+ _ref2$getMoreActions = _ref2.getMoreActions,
1514
+ getMoreActions = _ref2$getMoreActions === void 0 ? neetoCist.noop : _ref2$getMoreActions,
1515
+ _ref2$getAddActions = _ref2.getAddActions,
1516
+ getAddActions = _ref2$getAddActions === void 0 ? neetoCist.noop : _ref2$getAddActions;
1517
+ var moreActions = getMoreActions(node) || [];
1518
+ var addActions = getAddActions(node) || [];
1519
+ var hasMoreActions = neetoCist.isNotEmpty(moreActions);
1520
+ var hasAddActions = neetoCist.isNotEmpty(addActions);
1521
+ var hasAnyActions = hasMoreActions || hasAddActions;
1522
+ return /*#__PURE__*/jsxRuntime.jsx(reactRouterDom.NavLink, {
1523
+ activeClassName: "active",
1524
+ className: "neeto-sidebar-folders-tree__folder-node",
1525
+ isActive: function isActive() {
1526
+ return _isActive;
1527
+ },
1528
+ to: link,
1529
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
1530
+ className: "flex items-center justify-between w-full group relative",
1531
+ "data-testid": "".concat(neetoCist.hyphenate(name), "-").concat(isFolder ? "folder" : "item", "-sublink"),
1532
+ title: "",
1533
+ children: [isFolder && (isExpanded ? /*#__PURE__*/jsxRuntime.jsx(FolderIconOpen, {
1534
+ className: "flex-shrink-0 me-1",
1535
+ size: 16
1536
+ }) : /*#__PURE__*/jsxRuntime.jsx(FolderIcon, {
1537
+ className: "flex-shrink-0 me-1",
1538
+ size: 16
1539
+ })), /*#__PURE__*/jsxRuntime.jsxs("div", {
1540
+ className: "flex items-center min-w-0 flex-1",
1541
+ children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
1542
+ as: "span",
1543
+ className: "line-clamp-1 block truncate ps-0.5",
1544
+ title: name,
1545
+ variant: "body2",
1546
+ children: name
1547
+ }), isPrivate && /*#__PURE__*/jsxRuntime.jsx("span", {
1548
+ title: t("common.private"),
1549
+ children: /*#__PURE__*/jsxRuntime.jsx(lucideReact.Lock, {
1550
+ className: "flex-shrink-0 ms-1",
1551
+ size: 16
1552
+ })
1553
+ })]
1554
+ }), hasAnyActions && /*#__PURE__*/jsxRuntime.jsxs("div", {
1555
+ className: "flex items-center gap-0.5 py-0.5 absolute end-0 top-0 h-full neeto-sidebar-folders-tree__folder-node-actions neeto-ui-rounded-md ps-2",
1556
+ onClick: function onClick(e) {
1557
+ e.preventDefault();
1558
+ e.stopPropagation();
1559
+ },
1560
+ children: [hasAddActions && /*#__PURE__*/jsxRuntime.jsx(MoreDropdown, {
1561
+ menuItems: addActions,
1562
+ dropdownButtonProps: {
1563
+ icon: lucideReact.Plus,
1564
+ size: "icon",
1565
+ tooltipProps: {
1566
+ content: "Add",
1567
+ position: "top"
1568
+ },
1569
+ className: "opacity-0 group-hover:opacity-100 transition-opacity neeto-sidebar-folders-tree__action-button size-5"
1570
+ }
1571
+ }), hasMoreActions && /*#__PURE__*/jsxRuntime.jsx(MoreDropdown, {
1572
+ menuItems: moreActions,
1573
+ dropdownButtonProps: {
1574
+ size: "icon",
1575
+ className: "opacity-0 group-hover:opacity-100 transition-opacity neeto-sidebar-folders-tree__action-button size-5"
1576
+ }
1577
+ })]
1578
+ })]
1579
+ })
1580
+ });
1581
+ };
1582
+
1583
+ 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; }
1584
+ 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), true).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; }
1585
+ var DownIcon = function DownIcon(props) {
1586
+ return /*#__PURE__*/jsxRuntime.jsx("svg", _objectSpread$5(_objectSpread$5({
1587
+ fill: "none",
1588
+ height: "6",
1589
+ viewBox: "0 0 6 6",
1590
+ width: "6",
1591
+ xmlns: "http://www.w3.org/2000/svg"
1592
+ }, props), {}, {
1593
+ children: /*#__PURE__*/jsxRuntime.jsx("path", {
1594
+ d: "M3.803 5.475a.35.35 0 0 1-.606 0l-2.425-4.2A.35.35 0 0 1 1.075.75h4.85a.35.35 0 0 1 .303.525z",
1595
+ fill: "currentColor"
1596
+ })
1597
+ }));
1598
+ };
1599
+
1600
+ function ownKeys$4(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; }
1601
+ function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1602
+ var RightIcon = function RightIcon(props) {
1603
+ return /*#__PURE__*/jsxRuntime.jsx("svg", _objectSpread$4(_objectSpread$4({
1604
+ fill: "none",
1605
+ height: "6",
1606
+ viewBox: "0 0 6 6",
1607
+ width: "6",
1608
+ xmlns: "http://www.w3.org/2000/svg"
1609
+ }, props), {}, {
1610
+ children: /*#__PURE__*/jsxRuntime.jsx("path", {
1611
+ d: "M5.475 2.697a.35.35 0 0 1 0 .606l-4.2 2.425a.35.35 0 0 1-.525-.303V.575a.35.35 0 0 1 .525-.303z",
1612
+ fill: "currentColor"
1613
+ })
1614
+ }));
1615
+ };
1616
+
1617
+ var SwitcherIcon = function SwitcherIcon(_ref) {
1618
+ var expanded = _ref.expanded;
1619
+ return expanded ? /*#__PURE__*/jsxRuntime.jsx(DownIcon, {
1620
+ className: "relative",
1621
+ size: 16
1622
+ }) : /*#__PURE__*/jsxRuntime.jsx(RightIcon, {
1623
+ className: "relative",
1624
+ size: 16
1625
+ });
1626
+ };
1627
+
1628
+ function ownKeys$3(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; }
1629
+ function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1630
+ var splitItemsByFolder = function splitItemsByFolder(items) {
1631
+ return items.reduce(function (acc, item) {
1632
+ var value = _objectSpread$3(_objectSpread$3({}, item), {}, {
1633
+ isFolder: false,
1634
+ isLeaf: true
1635
+ });
1636
+ if (item.folderId) {
1637
+ if (!acc.itemsByFolderId[item.folderId]) {
1638
+ acc.itemsByFolderId[item.folderId] = [];
1639
+ }
1640
+ acc.itemsByFolderId[item.folderId].push(_objectSpread$3({}, value));
1641
+ } else {
1642
+ acc.rootItems.push(value);
1643
+ }
1644
+ return acc;
1645
+ }, {
1646
+ itemsByFolderId: {},
1647
+ rootItems: []
1648
+ });
1649
+ };
1650
+ var _appendItemsToFolders = function appendItemsToFolders(folders, itemsByFolderId) {
1651
+ return folders.map(function (folder) {
1652
+ return _objectSpread$3(_objectSpread$3({}, folder), {}, {
1653
+ isFolder: true,
1654
+ isLeaf: false,
1655
+ children: [].concat(_toConsumableArray(_appendItemsToFolders(folder.children || [], itemsByFolderId)), _toConsumableArray(itemsByFolderId[folder.id] || []))
1656
+ });
1657
+ });
1658
+ };
1659
+ var buildTreeWithItems = function buildTreeWithItems(folders, _ref) {
1660
+ var items = _ref.items;
1661
+ if (!items || !folders) return folders;
1662
+ var _splitItemsByFolder = splitItemsByFolder(items),
1663
+ itemsByFolderId = _splitItemsByFolder.itemsByFolderId,
1664
+ rootItems = _splitItemsByFolder.rootItems;
1665
+ var foldersWithItems = _appendItemsToFolders(folders, itemsByFolderId);
1666
+ return [].concat(_toConsumableArray(foldersWithItems), _toConsumableArray(rootItems));
1667
+ };
1668
+
1669
+ // neeto-atoms Tree (react-arborist based) requires `key`/`title` on every node
1670
+ // and has no `fieldNames` prop, unlike neetoui's antd Tree which used
1671
+ // fieldNames={{ key: "sid" }}. Map them in while preserving the original fields
1672
+ // (sid, link, meta, isFolder, isPrivate, …) so titleRender/onExpand keep working.
1673
+ var _toAtomsTreeData = function toAtomsTreeData() {
1674
+ var nodes = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
1675
+ return nodes.map(function (node) {
1676
+ return _objectSpread$3(_objectSpread$3({}, node), {}, {
1677
+ key: node.sid,
1678
+ title: node.name,
1679
+ children: node.children ? _toAtomsTreeData(node.children) : undefined
1680
+ });
1681
+ });
1682
+ };
1683
+
1684
+ function ownKeys$2(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; }
1685
+ function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1686
+ var FoldersTree = function FoldersTree(_ref) {
1687
+ var configProps = _ref.config;
1688
+ var config = _objectSpread$2(_objectSpread$2({}, useFolderActions.DEFAULT_CONFIG), configProps);
1689
+ var _useState = React.useState(new Set()),
1690
+ _useState2 = _slicedToArray(_useState, 2),
1691
+ expandedKeysSet = _useState2[0],
1692
+ setExpandedKeysSet = _useState2[1];
1693
+ var expandedKeys = Array.from(expandedKeysSet);
1694
+ var _useTranslation = injectCss.useTranslation(config),
1695
+ t = _useTranslation.t;
1696
+ var params = reactUtils.useQueryParams({
1697
+ toCamelCase: false
1698
+ });
1699
+ var activeFolderSid = internal.getActiveFolderId(config);
1700
+ var _useFetchFolders = useFolderActions.useFetchFolders(config),
1701
+ folders = _useFetchFolders.data;
1702
+ var treeData = React.useMemo(function () {
1703
+ return _toAtomsTreeData(buildTreeWithItems(folders, config));
1704
+ }, [folders, config.items]);
1705
+ var updateExpandedKeys = function updateExpandedKeys() {
1706
+ var _activeFolder$meta;
1707
+ if (!treeData) return;
1708
+ // When active folder changes from external sources, update expanded keys to auto expand tree.
1709
+ var updatedExpandedKeys = new Set(expandedKeysSet);
1710
+ var map = utils.treeToMap(treeData, "sid");
1711
+ var activeFolder = map[activeFolderSid];
1712
+ var parentSid = activeFolder === null || activeFolder === void 0 || (_activeFolder$meta = activeFolder.meta) === null || _activeFolder$meta === void 0 || (_activeFolder$meta = _activeFolder$meta.parent) === null || _activeFolder$meta === void 0 ? void 0 : _activeFolder$meta.sid;
1713
+ if (parentSid && !expandedKeysSet.has(parentSid)) {
1714
+ updatedExpandedKeys.add(parentSid);
1715
+ }
1716
+ };
1717
+ var handleExpand = function handleExpand(keys, _ref2) {
1718
+ var expanded = _ref2.expanded,
1719
+ node = _ref2.node;
1720
+ var keysSet = new Set(keys);
1721
+ if (!expanded) {
1722
+ var _removeChildKeys = function removeChildKeys() {
1723
+ var children = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
1724
+ children.forEach(function (child) {
1725
+ keysSet["delete"](child.sid);
1726
+ _removeChildKeys(child.children);
1727
+ });
1728
+ };
1729
+ _removeChildKeys(node.children);
1730
+ }
1731
+ setExpandedKeysSet(keysSet);
1732
+ };
1733
+ React.useEffect(function () {
1734
+ // Non urgent update.
1735
+ React.startTransition(updateExpandedKeys);
1736
+ }, [activeFolderSid, treeData]);
1737
+ if (neetoCist.isNotPresent(treeData)) {
1738
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
1739
+ className: "w-full text-center",
1740
+ variant: "body2",
1741
+ weight: "semibold",
1742
+ children: t("folders.noFolders")
1743
+ });
1744
+ }
1745
+ return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Tree, {
1746
+ expandedKeys: expandedKeys,
1747
+ treeData: treeData,
1748
+ autoExpandParent: true,
1749
+ blockNode: true,
1750
+ className: "neeto-sidebar-folders-tree",
1751
+ indent: 20,
1752
+ rowHeight: 24,
1753
+ selectedKeys: [activeFolderSid],
1754
+ showLine: false,
1755
+ switcherIcon: SwitcherIcon,
1756
+ titleRender: function titleRender(node) {
1757
+ return /*#__PURE__*/jsxRuntime.jsx(Node, {
1758
+ config: config,
1759
+ node: node,
1760
+ isActive: node.sid === activeFolderSid,
1761
+ isExpanded: expandedKeysSet.has(node.sid),
1762
+ link: node.link || utils$1.buildUrl(config.folderPath, _objectSpread$2(_objectSpread$2({}, params), {}, {
1763
+ folderId: node.sid
1764
+ }))
1765
+ });
1766
+ },
1767
+ onExpand: handleExpand
1768
+ });
1769
+ };
1770
+
1771
+ function ownKeys$1(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; }
1772
+ function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1773
+ // neeto-atoms TreeSelect expects nested treeData ({ key, title, children }) and
1774
+ // has no `treeDataSimpleMode`, unlike neetoui's antd TreeSelect which consumed a
1775
+ // flat list keyed by pId. Build the nested shape directly from the folders tree,
1776
+ // pruning folders at/below maxDepth (and their subtrees).
1777
+ //
1778
+ // Depth is derived structurally from the recursion level (roots = 0), matching
1779
+ // treeToMap/walkTree — the raw `folders` from the API don't carry a computed
1780
+ // `meta.depth`; v1 only had it because it passed the treeToMap'd map.
1781
+ var _createFolderOptions = function createFolderOptions(folders, config) {
1782
+ var depth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
1783
+ if (depth >= config.maxDepth) return [];
1784
+ return (folders !== null && folders !== void 0 ? folders : []).map(function (folder) {
1785
+ var children = _createFolderOptions(folder.children, config, depth + 1);
1786
+ return _objectSpread$1({
1787
+ key: folder.id,
1788
+ title: folder.name
1789
+ }, children.length > 0 && {
1790
+ children: children
1791
+ });
1792
+ });
1793
+ };
1794
+
1795
+ var _excluded = ["label", "name", "placeholder", "disabled", "required", "showSearch", "allowClear", "config", "initialValue"];
1796
+ function ownKeys(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; }
1797
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1798
+ var TreeSelect = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
1799
+ var _ref$label = _ref.label,
1800
+ label = _ref$label === void 0 ? "" : _ref$label,
1801
+ name = _ref.name,
1802
+ _ref$placeholder = _ref.placeholder,
1803
+ placeholder = _ref$placeholder === void 0 ? "" : _ref$placeholder,
1804
+ _ref$disabled = _ref.disabled,
1805
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
1806
+ _ref$required = _ref.required,
1807
+ required = _ref$required === void 0 ? false : _ref$required,
1808
+ _ref$showSearch = _ref.showSearch,
1809
+ showSearch = _ref$showSearch === void 0 ? true : _ref$showSearch,
1810
+ _ref$allowClear = _ref.allowClear,
1811
+ allowClear = _ref$allowClear === void 0 ? false : _ref$allowClear,
1812
+ config = _ref.config,
1813
+ initialValue = _ref.initialValue,
1814
+ otherProps = _objectWithoutProperties(_ref, _excluded);
1815
+ var _useFetchFolders = useFolderActions.useFetchFolders(config),
1816
+ folders = _useFetchFolders.data;
1817
+ var _useFormikContext = formik$1.useFormikContext(),
1818
+ values = _useFormikContext.values,
1819
+ setFieldValue = _useFormikContext.setFieldValue;
1820
+ var foldersMap = React.useMemo(function () {
1821
+ return folders ? utils.treeToMap(folders, "sid") : null;
1822
+ }, [folders]);
1823
+ var activeFolderSid = initialValue || internal.getActiveFolderId(config);
1824
+ var activeFolder = foldersMap[activeFolderSid];
1825
+ var isValidParent = (activeFolder === null || activeFolder === void 0 ? void 0 : activeFolder.meta.depth) < config.maxDepth;
1826
+ var parentId = isValidParent ? activeFolder.id : null;
1827
+ React.useEffect(function () {
1828
+ if (values.name !== "") return;
1829
+ setFieldValue(name, parentId);
1830
+ }, [parentId, name]);
1831
+ var folderOptions = React.useMemo(function () {
1832
+ return _createFolderOptions(folders !== null && folders !== void 0 ? folders : [], config);
1833
+ }, [folders]);
1834
+ return /*#__PURE__*/jsxRuntime.jsx(formik.TreeSelect, _objectSpread({
1835
+ isClearable: allowClear,
1836
+ isDisabled: disabled,
1837
+ isSearchable: showSearch,
1838
+ treeData: folderOptions
1839
+ }, _objectSpread({
1840
+ label: label,
1841
+ name: name,
1842
+ placeholder: placeholder,
1843
+ ref: ref,
1844
+ required: required
1845
+ }, otherProps)));
1846
+ });
1847
+ TreeSelect.displayName = "TreeSelect";
1848
+
1849
+ 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:2px!important}.neeto-sidebar-folders-tree.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:rgb(var(--neeto-ui-gray-100));color:rgb(var(--neeto-ui-accent-800))!important;font-weight:500}.neeto-sidebar-folders-tree.ant-tree .ant-tree-switcher{margin-inline-end:0}.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))}.neeto-sidebar-folders-tree.ant-tree .ant-tree-node-content-wrapper:hover .neeto-sidebar-folders-tree__folder-node-actions{background-image:linear-gradient(90deg,rgba(var(--neeto-ui-gray-100),.5) 0,rgba(var(--neeto-ui-gray-100),1) 25%)}.neeto-sidebar-folders-tree.ant-tree .ant-tree-treenode{margin-bottom:6px}.neeto-sidebar-folders-tree.ant-tree .ant-tree-treenode:before{height:6px}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFwcC9qYXZhc2NyaXB0L3NyYy92Mi9jb21wb25lbnRzL25lZXRvLWZvbGRlcnMtbmFuby5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHlDQUNFLHVCQUNGLENBRUEsb0VBRUUsV0FBQSxDQURBLDRCQUVGLENBRUEsMkZBRUUsOENBQUEsQ0FEQSwrQ0FBQSxDQUVBLGVBQ0YsQ0FFQSx3REFDRSxtQkFDRixDQUVBLGdGQUNFLGlCQUNGLENBRUEsaUNBQ0UseURBQ0YsQ0FFQSwySEFDRSxnSEFDRixDQUVBLHdEQUNFLGlCQUNGLENBRUEsK0RBQ0UsVUFDRiIsInNvdXJjZXNDb250ZW50IjpbIi5uZWV0by1zaWRlYmFyLWZvbGRlcnMtdHJlZV9fZm9sZGVyLW5vZGUge1xuICBjb2xvcjogaW5oZXJpdCAhaW1wb3J0YW50O1xufVxuXG4ubmVldG8tc2lkZWJhci1mb2xkZXJzLXRyZWUuYW50LXRyZWUgLmFudC10cmVlLW5vZGUtY29udGVudC13cmFwcGVyIHtcbiAgcGFkZGluZy1pbmxpbmU6IDJweCAhaW1wb3J0YW50O1xuICBtaW4td2lkdGg6IDA7XG59XG5cbi5uZWV0by1zaWRlYmFyLWZvbGRlcnMtdHJlZS5hbnQtdHJlZSAuYW50LXRyZWUtbm9kZS1jb250ZW50LXdyYXBwZXIuYW50LXRyZWUtbm9kZS1zZWxlY3RlZCB7XG4gIGNvbG9yOiByZ2IodmFyKC0tbmVldG8tdWktYWNjZW50LTgwMCkpICFpbXBvcnRhbnQ7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYih2YXIoLS1uZWV0by11aS1ncmF5LTEwMCkpO1xuICBmb250LXdlaWdodDogNTAwO1xufVxuXG4ubmVldG8tc2lkZWJhci1mb2xkZXJzLXRyZWUuYW50LXRyZWUgLmFudC10cmVlLXN3aXRjaGVyIHtcbiAgbWFyZ2luLWlubGluZS1lbmQ6IDA7XG59XG5cbi5uZWV0by1zaWRlYmFyLWZvbGRlcnMtdHJlZS5hbnQtdHJlZSAuYW50LXRyZWUtc3dpdGNoZXIgLmFudC10cmVlLXN3aXRjaGVyLWljb24ge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbi5uZWV0by1mb2xkZXJzLWdyaWQtdmlldy13cmFwcGVyIHtcbiAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiByZXBlYXQoYXV0by1maWxsLCBtaW5tYXgoMjU2cHgsIDFmcikpO1xufVxuXG4ubmVldG8tc2lkZWJhci1mb2xkZXJzLXRyZWUuYW50LXRyZWUgLmFudC10cmVlLW5vZGUtY29udGVudC13cmFwcGVyOmhvdmVyIC5uZWV0by1zaWRlYmFyLWZvbGRlcnMtdHJlZV9fZm9sZGVyLW5vZGUtYWN0aW9ucyB7XG4gIGJhY2tncm91bmQtaW1hZ2U6IGxpbmVhci1ncmFkaWVudCg5MGRlZywgcmdiYSh2YXIoLS1uZWV0by11aS1ncmF5LTEwMCksIC41KSAwLCByZ2JhKHZhcigtLW5lZXRvLXVpLWdyYXktMTAwKSwgMSkgMjUlKTtcbn1cblxuLm5lZXRvLXNpZGViYXItZm9sZGVycy10cmVlLmFudC10cmVlIC5hbnQtdHJlZS10cmVlbm9kZSB7XG4gIG1hcmdpbi1ib3R0b206IDZweDtcbn1cblxuLm5lZXRvLXNpZGViYXItZm9sZGVycy10cmVlLmFudC10cmVlIC5hbnQtdHJlZS10cmVlbm9kZTo6YmVmb3JlIHtcbiAgaGVpZ2h0OiA2cHg7XG59XG4iXX0= */";
1850
+ injectCss.n(css,{});
1851
+
1852
+ exports.AddEditPane = AddEditPane;
1853
+ exports.DraggableWrapper = DraggableWrapper;
1854
+ exports.FoldersContext = FoldersContext;
1855
+ exports.FoldersDnd = FoldersDnd;
1856
+ exports.FoldersList = FoldersList;
1857
+ exports.FoldersTree = FoldersTree;
1858
+ exports.MoveToFolderPane = MoveToFolderPane;
1859
+ exports.TreeSelect = TreeSelect;
1860
+ //# sourceMappingURL=components.js.map