@payloadcms/ui 4.0.0-canary.5 → 4.0.0-canary.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/css/forms.css +6 -3
- package/dist/css/theme.css +2 -1
- package/dist/elements/AddNewRelation/index.css +1 -1
- package/dist/elements/DatePicker/index.css +1 -1
- package/dist/elements/DatePicker/index.js +1 -1
- package/dist/elements/DatePicker/index.js.map +1 -1
- package/dist/elements/DocumentFields/index.css +1 -0
- package/dist/elements/EditUpload/index.d.ts.map +1 -1
- package/dist/elements/EditUpload/index.js +4 -0
- package/dist/elements/EditUpload/index.js.map +1 -1
- package/dist/elements/Hierarchy/ColumnBrowser/Column/index.css +3 -1
- package/dist/elements/Hierarchy/ColumnBrowser/ColumnItem/index.css +1 -0
- package/dist/elements/Hierarchy/ColumnBrowser/types.d.ts +1 -1
- package/dist/elements/Hierarchy/ColumnBrowser/types.d.ts.map +1 -1
- package/dist/elements/Hierarchy/ColumnBrowser/types.js.map +1 -1
- package/dist/elements/Hierarchy/DocHeaderButton/index.js +12 -12
- package/dist/elements/Hierarchy/DocHeaderButton/index.js.map +1 -1
- package/dist/elements/Hierarchy/Field/index.client.js +14 -14
- package/dist/elements/Hierarchy/Field/index.client.js.map +1 -1
- package/dist/elements/Hierarchy/Modal/fetchAncestorPath.d.ts.map +1 -0
- package/dist/elements/Hierarchy/Modal/fetchAncestorPath.js.map +1 -0
- package/dist/elements/Hierarchy/Modal/index.css +88 -0
- package/dist/elements/Hierarchy/Modal/index.d.ts +20 -0
- package/dist/elements/Hierarchy/Modal/index.d.ts.map +1 -0
- package/dist/elements/Hierarchy/{Drawer → Modal}/index.js +105 -81
- package/dist/elements/Hierarchy/Modal/index.js.map +1 -0
- package/dist/elements/Hierarchy/{Drawer → Modal}/types.d.ts +22 -18
- package/dist/elements/Hierarchy/Modal/types.d.ts.map +1 -0
- package/dist/elements/Hierarchy/Modal/types.js.map +1 -0
- package/dist/elements/Hierarchy/Modal/useHierarchyModal.d.ts +30 -0
- package/dist/elements/Hierarchy/Modal/useHierarchyModal.d.ts.map +1 -0
- package/dist/elements/Hierarchy/{Drawer/useHierarchyDrawer.js → Modal/useHierarchyModal.js} +51 -50
- package/dist/elements/Hierarchy/Modal/useHierarchyModal.js.map +1 -0
- package/dist/elements/Hierarchy/MoveMany/index.d.ts +2 -2
- package/dist/elements/Hierarchy/MoveMany/index.d.ts.map +1 -1
- package/dist/elements/Hierarchy/MoveMany/index.js +9 -9
- package/dist/elements/Hierarchy/MoveMany/index.js.map +1 -1
- package/dist/elements/LivePreview/Toolbar/SizeInput/index.d.ts.map +1 -1
- package/dist/elements/LivePreview/Toolbar/SizeInput/index.js +1 -0
- package/dist/elements/LivePreview/Toolbar/SizeInput/index.js.map +1 -1
- package/dist/elements/LivePreview/Window/index.css +6 -0
- package/dist/elements/ReactSelect/index.css +2 -2
- package/dist/elements/ReactSelect/index.js +1 -1
- package/dist/elements/ReactSelect/index.js.map +1 -1
- package/dist/elements/Table/DefaultCell/fields/Hierarchy/index.js +24 -24
- package/dist/elements/Table/DefaultCell/fields/Hierarchy/index.js.map +1 -1
- package/dist/elements/TimezonePicker/index.css +1 -1
- package/dist/exports/client/index.d.ts +2 -2
- package/dist/exports/client/index.d.ts.map +1 -1
- package/dist/exports/client/index.js +26 -26
- package/dist/exports/client/index.js.map +4 -4
- package/dist/fields/ConfirmPassword/index.d.ts +4 -0
- package/dist/fields/ConfirmPassword/index.d.ts.map +1 -1
- package/dist/fields/ConfirmPassword/index.js +37 -33
- package/dist/fields/ConfirmPassword/index.js.map +1 -1
- package/dist/fields/Number/Input.d.ts.map +1 -1
- package/dist/fields/Number/Input.js +29 -25
- package/dist/fields/Number/Input.js.map +1 -1
- package/dist/fields/Number/types.d.ts +4 -0
- package/dist/fields/Number/types.d.ts.map +1 -1
- package/dist/fields/Number/types.js.map +1 -1
- package/dist/fields/Password/input.d.ts.map +1 -1
- package/dist/fields/Password/input.js +33 -29
- package/dist/fields/Password/input.js.map +1 -1
- package/dist/fields/Password/types.d.ts +4 -0
- package/dist/fields/Password/types.d.ts.map +1 -1
- package/dist/fields/Password/types.js.map +1 -1
- package/dist/fields/Relationship/Input.d.ts.map +1 -1
- package/dist/fields/Relationship/Input.js +2 -0
- package/dist/fields/Relationship/Input.js.map +1 -1
- package/dist/fields/Relationship/types.d.ts +4 -0
- package/dist/fields/Relationship/types.d.ts.map +1 -1
- package/dist/fields/Relationship/types.js.map +1 -1
- package/dist/fields/Select/Input.d.ts +4 -0
- package/dist/fields/Select/Input.d.ts.map +1 -1
- package/dist/fields/Select/Input.js +44 -40
- package/dist/fields/Select/Input.js.map +1 -1
- package/dist/fields/Text/Input.d.ts.map +1 -1
- package/dist/fields/Text/Input.js +25 -21
- package/dist/fields/Text/Input.js.map +1 -1
- package/dist/fields/Text/types.d.ts +4 -0
- package/dist/fields/Text/types.d.ts.map +1 -1
- package/dist/fields/Text/types.js.map +1 -1
- package/dist/fields/Textarea/Input.d.ts.map +1 -1
- package/dist/fields/Textarea/Input.js +27 -23
- package/dist/fields/Textarea/Input.js.map +1 -1
- package/dist/fields/Textarea/index.css +1 -1
- package/dist/fields/Textarea/types.d.ts +4 -0
- package/dist/fields/Textarea/types.d.ts.map +1 -1
- package/dist/fields/Textarea/types.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +5 -5
- package/dist/elements/Hierarchy/Drawer/fetchAncestorPath.d.ts.map +0 -1
- package/dist/elements/Hierarchy/Drawer/fetchAncestorPath.js.map +0 -1
- package/dist/elements/Hierarchy/Drawer/index.css +0 -90
- package/dist/elements/Hierarchy/Drawer/index.d.ts +0 -20
- package/dist/elements/Hierarchy/Drawer/index.d.ts.map +0 -1
- package/dist/elements/Hierarchy/Drawer/index.js.map +0 -1
- package/dist/elements/Hierarchy/Drawer/types.d.ts.map +0 -1
- package/dist/elements/Hierarchy/Drawer/types.js.map +0 -1
- package/dist/elements/Hierarchy/Drawer/useHierarchyDrawer.d.ts +0 -30
- package/dist/elements/Hierarchy/Drawer/useHierarchyDrawer.d.ts.map +0 -1
- package/dist/elements/Hierarchy/Drawer/useHierarchyDrawer.js.map +0 -1
- /package/dist/elements/Hierarchy/{Drawer → Modal}/fetchAncestorPath.d.ts +0 -0
- /package/dist/elements/Hierarchy/{Drawer → Modal}/fetchAncestorPath.js +0 -0
- /package/dist/elements/Hierarchy/{Drawer → Modal}/types.js +0 -0
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { HierarchyModalTogglerProps, UseHierarchyModal } from './types.js';
|
|
3
|
+
export * from './types.js';
|
|
4
|
+
export declare const formatHierarchyModalSlug: ({ depth, uuid, }: {
|
|
5
|
+
depth: number;
|
|
6
|
+
uuid: string;
|
|
7
|
+
}) => string;
|
|
8
|
+
export declare const HierarchyModalToggler: React.FC<HierarchyModalTogglerProps>;
|
|
9
|
+
/**
|
|
10
|
+
* Hook for using a hierarchy modal for selecting hierarchy items.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* const [HierarchyModal, HierarchyModalToggler, { closeModal, openModal }] = useHierarchyModal({
|
|
15
|
+
* collectionSlug: 'categories',
|
|
16
|
+
* })
|
|
17
|
+
*
|
|
18
|
+
* return (
|
|
19
|
+
* <>
|
|
20
|
+
* <HierarchyModal
|
|
21
|
+
* onSave={(selections) => console.log(selections)}
|
|
22
|
+
* hasMany={true}
|
|
23
|
+
* />
|
|
24
|
+
* <HierarchyModalToggler>Select Categories</HierarchyModalToggler>
|
|
25
|
+
* </>
|
|
26
|
+
* )
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export declare const useHierarchyModal: UseHierarchyModal;
|
|
30
|
+
//# sourceMappingURL=useHierarchyModal.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useHierarchyModal.d.ts","sourceRoot":"","sources":["../../../../src/elements/Hierarchy/Modal/useHierarchyModal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAwD,MAAM,OAAO,CAAA;AAE5E,OAAO,KAAK,EAAuB,0BAA0B,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAEpG,cAAc,YAAY,CAAA;AAQ1B,eAAO,MAAM,wBAAwB,GAAI,kBAGtC;IACD,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb,KAAG,MAA4C,CAAA;AAEhD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAmBtE,CAAA;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,iBAAiB,EAAE,iBAqH/B,CAAA"}
|
|
@@ -1,57 +1,56 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
3
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
-
import { createElement as _createElement } from "react";
|
|
5
4
|
import { useModal } from '@faceless-ui/modal';
|
|
6
|
-
import React, { useCallback, useId, useMemo, useRef } from 'react';
|
|
5
|
+
import React, { useCallback, useId, useMemo, useRef, useState } from 'react';
|
|
7
6
|
export * from './types.js';
|
|
8
7
|
import { useConfig } from '../../../providers/Config/index.js';
|
|
9
8
|
import { useEditDepth } from '../../../providers/EditDepth/index.js';
|
|
10
9
|
import { useHierarchy } from '../../../providers/Hierarchy/index.js';
|
|
11
|
-
import { DrawerToggler } from '../../Drawer/index.js';
|
|
12
|
-
import { baseClass,
|
|
13
|
-
export const
|
|
10
|
+
import { DrawerToggler as ModalToggler } from '../../Drawer/index.js';
|
|
11
|
+
import { baseClass, HierarchyModal } from './index.js';
|
|
12
|
+
export const formatHierarchyModalSlug = ({
|
|
14
13
|
depth,
|
|
15
14
|
uuid
|
|
16
|
-
}) => `hierarchy-
|
|
17
|
-
export const
|
|
15
|
+
}) => `hierarchy-modal_${depth}_${uuid}`;
|
|
16
|
+
export const HierarchyModalToggler = ({
|
|
18
17
|
children,
|
|
19
18
|
className,
|
|
20
19
|
disabled,
|
|
21
|
-
|
|
20
|
+
modalSlug,
|
|
22
21
|
onClick,
|
|
23
22
|
...rest
|
|
24
23
|
}) => {
|
|
25
|
-
return /*#__PURE__*/_jsx(
|
|
24
|
+
return /*#__PURE__*/_jsx(ModalToggler, {
|
|
26
25
|
className: [className, `${baseClass}__toggler`].filter(Boolean).join(' '),
|
|
27
26
|
disabled: disabled,
|
|
28
27
|
onClick: onClick,
|
|
29
|
-
slug:
|
|
28
|
+
slug: modalSlug,
|
|
30
29
|
...rest,
|
|
31
30
|
children: children
|
|
32
31
|
});
|
|
33
32
|
};
|
|
34
33
|
/**
|
|
35
|
-
* Hook for using a hierarchy
|
|
34
|
+
* Hook for using a hierarchy modal for selecting hierarchy items.
|
|
36
35
|
*
|
|
37
36
|
* @example
|
|
38
37
|
* ```tsx
|
|
39
|
-
* const [
|
|
38
|
+
* const [HierarchyModal, HierarchyModalToggler, { closeModal, openModal }] = useHierarchyModal({
|
|
40
39
|
* collectionSlug: 'categories',
|
|
41
40
|
* })
|
|
42
41
|
*
|
|
43
42
|
* return (
|
|
44
43
|
* <>
|
|
45
|
-
* <
|
|
44
|
+
* <HierarchyModal
|
|
46
45
|
* onSave={(selections) => console.log(selections)}
|
|
47
46
|
* hasMany={true}
|
|
48
47
|
* />
|
|
49
|
-
* <
|
|
48
|
+
* <HierarchyModalToggler>Select Categories</HierarchyModalToggler>
|
|
50
49
|
* </>
|
|
51
50
|
* )
|
|
52
51
|
* ```
|
|
53
52
|
*/
|
|
54
|
-
export const
|
|
53
|
+
export const useHierarchyModal = ({
|
|
55
54
|
disabledIds,
|
|
56
55
|
filterByCollection: filterByCollectionProp,
|
|
57
56
|
hierarchyCollectionSlug,
|
|
@@ -81,15 +80,16 @@ export const useHierarchyDrawer = ({
|
|
|
81
80
|
}
|
|
82
81
|
return allowedCollections !== null ? allowedCollections.map(c => c.slug) : undefined;
|
|
83
82
|
}, [filterByCollectionProp, allowedCollections]);
|
|
84
|
-
const
|
|
83
|
+
const modalDepth = useEditDepth();
|
|
85
84
|
const uuid = useId();
|
|
86
85
|
const {
|
|
87
86
|
closeModal,
|
|
88
87
|
openModal,
|
|
89
88
|
toggleModal
|
|
90
89
|
} = useModal();
|
|
91
|
-
const
|
|
92
|
-
|
|
90
|
+
const [reopenCount, setReopenCount] = useState(0);
|
|
91
|
+
const modalSlug = formatHierarchyModalSlug({
|
|
92
|
+
depth: modalDepth,
|
|
93
93
|
uuid
|
|
94
94
|
});
|
|
95
95
|
// Store modal functions in refs to ensure stable callbacks
|
|
@@ -101,48 +101,49 @@ export const useHierarchyDrawer = ({
|
|
|
101
101
|
openModalRef.current = openModal;
|
|
102
102
|
toggleModalRef.current = toggleModal;
|
|
103
103
|
// Stable callbacks using refs - these will NEVER change
|
|
104
|
-
const
|
|
105
|
-
toggleModalRef.current(
|
|
106
|
-
}, [
|
|
107
|
-
const
|
|
108
|
-
closeModalRef.current(
|
|
109
|
-
}, [
|
|
110
|
-
const
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
104
|
+
const toggleHierarchyModal = useCallback(() => {
|
|
105
|
+
toggleModalRef.current(modalSlug);
|
|
106
|
+
}, [modalSlug]);
|
|
107
|
+
const closeHierarchyModal = useCallback(() => {
|
|
108
|
+
closeModalRef.current(modalSlug);
|
|
109
|
+
}, [modalSlug]);
|
|
110
|
+
const openHierarchyModal = useCallback(() => {
|
|
111
|
+
setReopenCount(count => count + 1);
|
|
112
|
+
openModalRef.current(modalSlug);
|
|
113
|
+
}, [modalSlug]);
|
|
114
|
+
const MemoizedModal = useMemo(() => {
|
|
115
|
+
const ModalComponent = props => /*#__PURE__*/_jsx(HierarchyModal, {
|
|
115
116
|
...props,
|
|
116
117
|
baseFilter: baseFilter,
|
|
117
|
-
|
|
118
|
+
closeModal: closeHierarchyModal,
|
|
118
119
|
disabledIds: disabledIds,
|
|
119
|
-
drawerSlug: drawerSlug,
|
|
120
120
|
filterByCollection: filterByCollection,
|
|
121
121
|
hierarchyCollectionSlug: hierarchyCollectionSlug,
|
|
122
122
|
Icon: Icon,
|
|
123
|
-
|
|
123
|
+
modalSlug: modalSlug,
|
|
124
124
|
parentFieldName: parentFieldName,
|
|
125
|
+
reopenCount: reopenCount,
|
|
125
126
|
useAsTitle: useAsTitle
|
|
126
|
-
});
|
|
127
|
-
return
|
|
128
|
-
}, [baseFilter,
|
|
129
|
-
const
|
|
130
|
-
const TogglerComponent = props_0 => /*#__PURE__*/_jsx(
|
|
127
|
+
}, modalSlug);
|
|
128
|
+
return ModalComponent;
|
|
129
|
+
}, [baseFilter, closeHierarchyModal, disabledIds, filterByCollection, Icon, modalSlug, parentFieldName, reopenCount, hierarchyCollectionSlug, useAsTitle]);
|
|
130
|
+
const MemoizedModalToggler = useMemo(() => {
|
|
131
|
+
const TogglerComponent = props_0 => /*#__PURE__*/_jsx(HierarchyModalToggler, {
|
|
131
132
|
...props_0,
|
|
132
|
-
|
|
133
|
+
modalSlug: modalSlug
|
|
133
134
|
});
|
|
134
135
|
return TogglerComponent;
|
|
135
|
-
}, [
|
|
136
|
-
const
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
// Note: Not tracking
|
|
136
|
+
}, [modalSlug]);
|
|
137
|
+
const MemoizedModalState = useMemo(() => ({
|
|
138
|
+
closeModal: closeHierarchyModal,
|
|
139
|
+
modalDepth,
|
|
140
|
+
modalSlug,
|
|
141
|
+
// Note: Not tracking isModalOpen to prevent re-renders when other modals change state
|
|
141
142
|
// Consumers needing this can use useModal() directly
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
}), [
|
|
146
|
-
return [
|
|
143
|
+
isModalOpen: false,
|
|
144
|
+
openModal: openHierarchyModal,
|
|
145
|
+
toggleModal: toggleHierarchyModal
|
|
146
|
+
}), [closeHierarchyModal, modalDepth, modalSlug, openHierarchyModal, toggleHierarchyModal]);
|
|
147
|
+
return [MemoizedModal, MemoizedModalToggler, MemoizedModalState];
|
|
147
148
|
};
|
|
148
|
-
//# sourceMappingURL=
|
|
149
|
+
//# sourceMappingURL=useHierarchyModal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useHierarchyModal.js","names":["useModal","React","useCallback","useId","useMemo","useRef","useState","useConfig","useEditDepth","useHierarchy","DrawerToggler","ModalToggler","baseClass","HierarchyModal","formatHierarchyModalSlug","depth","uuid","HierarchyModalToggler","children","className","disabled","modalSlug","onClick","rest","_jsx","filter","Boolean","join","slug","useHierarchyModal","disabledIds","filterByCollection","filterByCollectionProp","hierarchyCollectionSlug","Icon","getEntityConfig","allowedCollections","baseFilter","collectionConfig","collectionSlug","useAsTitle","admin","hierarchyConfig","hierarchy","undefined","parentFieldName","map","c","modalDepth","closeModal","openModal","toggleModal","reopenCount","setReopenCount","closeModalRef","openModalRef","toggleModalRef","current","toggleHierarchyModal","closeHierarchyModal","openHierarchyModal","count","MemoizedModal","ModalComponent","props","MemoizedModalToggler","TogglerComponent","MemoizedModalState","isModalOpen"],"sources":["../../../../src/elements/Hierarchy/Modal/useHierarchyModal.tsx"],"sourcesContent":["'use client'\nimport { useModal } from '@faceless-ui/modal'\nimport React, { useCallback, useId, useMemo, useRef, useState } from 'react'\n\nimport type { HierarchyModalProps, HierarchyModalTogglerProps, UseHierarchyModal } from './types.js'\n\nexport * from './types.js'\n\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useEditDepth } from '../../../providers/EditDepth/index.js'\nimport { useHierarchy } from '../../../providers/Hierarchy/index.js'\nimport { DrawerToggler as ModalToggler } from '../../Drawer/index.js'\nimport { baseClass, HierarchyModal } from './index.js'\n\nexport const formatHierarchyModalSlug = ({\n depth,\n uuid,\n}: {\n depth: number\n uuid: string\n}): string => `hierarchy-modal_${depth}_${uuid}`\n\nexport const HierarchyModalToggler: React.FC<HierarchyModalTogglerProps> = ({\n children,\n className,\n disabled,\n modalSlug,\n onClick,\n ...rest\n}) => {\n return (\n <ModalToggler\n className={[className, `${baseClass}__toggler`].filter(Boolean).join(' ')}\n disabled={disabled}\n onClick={onClick}\n slug={modalSlug}\n {...rest}\n >\n {children}\n </ModalToggler>\n )\n}\n\n/**\n * Hook for using a hierarchy modal for selecting hierarchy items.\n *\n * @example\n * ```tsx\n * const [HierarchyModal, HierarchyModalToggler, { closeModal, openModal }] = useHierarchyModal({\n * collectionSlug: 'categories',\n * })\n *\n * return (\n * <>\n * <HierarchyModal\n * onSave={(selections) => console.log(selections)}\n * hasMany={true}\n * />\n * <HierarchyModalToggler>Select Categories</HierarchyModalToggler>\n * </>\n * )\n * ```\n */\nexport const useHierarchyModal: UseHierarchyModal = ({\n disabledIds,\n filterByCollection: filterByCollectionProp,\n hierarchyCollectionSlug,\n Icon,\n}) => {\n const { getEntityConfig } = useConfig()\n const { allowedCollections, baseFilter } = useHierarchy()\n const collectionConfig = getEntityConfig({ collectionSlug: hierarchyCollectionSlug })\n\n const useAsTitle = collectionConfig?.admin?.useAsTitle\n const hierarchyConfig =\n collectionConfig?.hierarchy && typeof collectionConfig.hierarchy === 'object'\n ? collectionConfig.hierarchy\n : undefined\n const parentFieldName = hierarchyConfig?.parentFieldName\n\n // Use explicit prop if provided, otherwise fall back to allowedCollections from context\n // - allowedCollections is null/undefined: no filtering (undefined)\n // - allowedCollections is []: folder accepts everything, show only unrestricted destinations ([])\n // - allowedCollections has values: show folders accepting those types\n // Memoize to prevent new array references on every render\n const filterByCollection = useMemo(() => {\n if (filterByCollectionProp !== undefined) {\n return filterByCollectionProp\n }\n return allowedCollections !== null ? allowedCollections.map((c) => c.slug) : undefined\n }, [filterByCollectionProp, allowedCollections])\n\n const modalDepth = useEditDepth()\n const uuid = useId()\n const { closeModal, openModal, toggleModal } = useModal()\n const [reopenCount, setReopenCount] = useState(0)\n\n const modalSlug = formatHierarchyModalSlug({\n depth: modalDepth,\n uuid,\n })\n\n // Store modal functions in refs to ensure stable callbacks\n // This prevents re-renders when other modals (like DocumentDrawer) change state\n const closeModalRef = useRef(closeModal)\n const openModalRef = useRef(openModal)\n const toggleModalRef = useRef(toggleModal)\n closeModalRef.current = closeModal\n openModalRef.current = openModal\n toggleModalRef.current = toggleModal\n\n // Stable callbacks using refs - these will NEVER change\n const toggleHierarchyModal = useCallback(() => {\n toggleModalRef.current(modalSlug)\n }, [modalSlug])\n\n const closeHierarchyModal = useCallback(() => {\n closeModalRef.current(modalSlug)\n }, [modalSlug])\n\n const openHierarchyModal = useCallback(() => {\n setReopenCount((count) => count + 1)\n openModalRef.current(modalSlug)\n }, [modalSlug])\n\n const MemoizedModal = useMemo(() => {\n const ModalComponent: React.FC<HierarchyModalProps> = (props) => (\n <HierarchyModal\n key={modalSlug}\n {...props}\n baseFilter={baseFilter}\n closeModal={closeHierarchyModal}\n disabledIds={disabledIds}\n filterByCollection={filterByCollection}\n hierarchyCollectionSlug={hierarchyCollectionSlug}\n Icon={Icon}\n modalSlug={modalSlug}\n parentFieldName={parentFieldName}\n reopenCount={reopenCount}\n useAsTitle={useAsTitle}\n />\n )\n\n return ModalComponent\n }, [\n baseFilter,\n closeHierarchyModal,\n disabledIds,\n filterByCollection,\n Icon,\n modalSlug,\n parentFieldName,\n reopenCount,\n hierarchyCollectionSlug,\n useAsTitle,\n ])\n\n const MemoizedModalToggler = useMemo(() => {\n const TogglerComponent: React.FC<Omit<HierarchyModalTogglerProps, 'modalSlug'>> = (props) => (\n <HierarchyModalToggler {...props} modalSlug={modalSlug} />\n )\n\n return TogglerComponent\n }, [modalSlug])\n\n const MemoizedModalState = useMemo(\n () => ({\n closeModal: closeHierarchyModal,\n modalDepth,\n modalSlug,\n // Note: Not tracking isModalOpen to prevent re-renders when other modals change state\n // Consumers needing this can use useModal() directly\n isModalOpen: false,\n openModal: openHierarchyModal,\n toggleModal: toggleHierarchyModal,\n }),\n [closeHierarchyModal, modalDepth, modalSlug, openHierarchyModal, toggleHierarchyModal],\n )\n\n return [MemoizedModal, MemoizedModalToggler, MemoizedModalState]\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export declare const baseClass = "move-many";
|
|
3
3
|
type MoveManyProps = {
|
|
4
|
-
/** Current parent ID -
|
|
4
|
+
/** Current parent ID - modal will open expanded to this location */
|
|
5
5
|
currentParentID?: null | number | string;
|
|
6
6
|
/** The hierarchy collection slug (e.g., 'folders') */
|
|
7
7
|
hierarchySlug: string;
|
|
8
|
-
/** Icon to display in the hierarchy
|
|
8
|
+
/** Icon to display in the hierarchy modal */
|
|
9
9
|
Icon?: React.ReactNode;
|
|
10
10
|
/** When multiple MoveMany components are rendered on the page, this will differentiate them */
|
|
11
11
|
modalPrefix?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Hierarchy/MoveMany/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAyC,MAAM,OAAO,CAAA;AAe7D,eAAO,MAAM,SAAS,cAAc,CAAA;AAEpC,KAAK,aAAa,GAAG;IACnB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Hierarchy/MoveMany/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAyC,MAAM,OAAO,CAAA;AAe7D,eAAO,MAAM,SAAS,cAAc,CAAA;AAEpC,KAAK,aAAa,GAAG;IACnB,oEAAoE;IACpE,eAAe,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IACxC,sDAAsD;IACtD,aAAa,EAAE,MAAM,CAAA;IACrB,6CAA6C;IAC7C,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,+FAA+F;IAC/F,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,4CAA4C;IAC5C,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE;QAAE,GAAG,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAA;KAAE,CAAC,CAAA;CACzD,CAAA;AAeD,wBAAgB,QAAQ,CAAC,EACvB,eAAe,EACf,aAAa,EACb,IAAI,EACJ,WAAW,EACX,SAAS,EACT,UAAU,GACX,EAAE,aAAa,qBAiQf"}
|
|
@@ -15,7 +15,7 @@ import { requests } from '../../../utilities/api.js';
|
|
|
15
15
|
import { ConfirmationModal } from '../../ConfirmationModal/index.js';
|
|
16
16
|
import { ListSelectionButton } from '../../ListSelection/index.js';
|
|
17
17
|
import { Translation } from '../../Translation/index.js';
|
|
18
|
-
import {
|
|
18
|
+
import { useHierarchyModal } from '../Modal/useHierarchyModal.js';
|
|
19
19
|
export const baseClass = 'move-many';
|
|
20
20
|
/**
|
|
21
21
|
* Gets the parent field name from the hierarchy config.
|
|
@@ -87,10 +87,10 @@ export function MoveMany({
|
|
|
87
87
|
const parentIds = selections[hierarchySlug]?.ids;
|
|
88
88
|
return parentIds?.length ? new Set(parentIds) : undefined;
|
|
89
89
|
}, [selections, hierarchySlug]);
|
|
90
|
-
const [
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
}] =
|
|
90
|
+
const [HierarchyModal,, {
|
|
91
|
+
closeModal,
|
|
92
|
+
openModal: openHierarchyModal
|
|
93
|
+
}] = useHierarchyModal({
|
|
94
94
|
disabledIds,
|
|
95
95
|
filterByCollection: requiredCollections,
|
|
96
96
|
hierarchyCollectionSlug: hierarchySlug,
|
|
@@ -210,7 +210,7 @@ export function MoveMany({
|
|
|
210
210
|
}));
|
|
211
211
|
}
|
|
212
212
|
if (!hasErrors || totalMoved > 0) {
|
|
213
|
-
|
|
213
|
+
closeModal();
|
|
214
214
|
onSuccess?.();
|
|
215
215
|
}
|
|
216
216
|
} catch (_err) {
|
|
@@ -218,7 +218,7 @@ export function MoveMany({
|
|
|
218
218
|
} finally {
|
|
219
219
|
setDestination(null);
|
|
220
220
|
}
|
|
221
|
-
}, [
|
|
221
|
+
}, [closeModal, destination, selections, parentFieldName, locale, api, i18n, t, label, onSuccess]);
|
|
222
222
|
if (count === 0 || !canMove) {
|
|
223
223
|
return null;
|
|
224
224
|
}
|
|
@@ -226,9 +226,9 @@ export function MoveMany({
|
|
|
226
226
|
children: [/*#__PURE__*/_jsx(ListSelectionButton, {
|
|
227
227
|
"aria-label": t('general:move'),
|
|
228
228
|
className: `${baseClass}__toggle`,
|
|
229
|
-
onClick:
|
|
229
|
+
onClick: openHierarchyModal,
|
|
230
230
|
children: t('general:move')
|
|
231
|
-
}), /*#__PURE__*/_jsx(
|
|
231
|
+
}), /*#__PURE__*/_jsx(HierarchyModal, {
|
|
232
232
|
hasMany: false,
|
|
233
233
|
initialSelections: currentParentID ? [currentParentID] : null,
|
|
234
234
|
onMoveToRoot: handleMoveToRoot,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["useModal","getTranslation","formatAdminURL","qs","React","useCallback","useMemo","useState","toast","useConfig","useDocumentSelection","useLocale","useTranslation","requests","ConfirmationModal","ListSelectionButton","Translation","useHierarchyDrawer","baseClass","getParentFieldName","hierarchyConfig","config","hierarchy","undefined","parentFieldName","MoveMany","currentParentID","hierarchySlug","Icon","modalPrefix","onSuccess","selections","i18n","t","code","locale","openModal","collections","routes","api","getSelectionsWithMetadata","destination","setDestination","confirmMoveDrawerSlug","requiredCollections","selectionsWithMeta","required","Set","collectionSlug","items","Object","entries","metadata","allowedCollections","slug","add","size","Array","from","disabledIds","parentIds","ids","length","HierarchyDrawer","closeDrawer","openDrawer","filterByCollection","hierarchyCollectionSlug","count","label","totalCount","labels","find","c","collectionLabel","plural","singular","push","join","hierarchyCollectionConfig","canMove","handleDrawerSave","selectionsMap","firstSelection","values","next","value","destinationId","id","destinationTitle","path","title","String","handleMoveToRoot","handleConfirmMove","totalMoved","hasErrors","queryString","stringify","where","in","addQueryPrefix","url","apiRoute","response","patch","body","JSON","headers","language","credentials","json","status","errors","error","message","description","map","movedCount","docs","successKey","success","_err","_jsxs","Fragment","_jsx","className","onClick","hasMany","initialSelections","onMoveToRoot","onSave","showMoveToRoot","elements","1","children","i18nKey","variables","confirmingLabel","heading","modalSlug","onConfirm"],"sources":["../../../../src/elements/Hierarchy/MoveMany/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatAdminURL } from 'payload/shared'\nimport * as qs from 'qs-esm'\nimport React, { useCallback, useMemo, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport type { SelectionWithPath } from '../Drawer/types.js'\n\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useDocumentSelection } from '../../../providers/DocumentSelection/index.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { requests } from '../../../utilities/api.js'\nimport { ConfirmationModal } from '../../ConfirmationModal/index.js'\nimport { ListSelectionButton } from '../../ListSelection/index.js'\nimport { Translation } from '../../Translation/index.js'\nimport { useHierarchyDrawer } from '../Drawer/useHierarchyDrawer.js'\n\nexport const baseClass = 'move-many'\n\ntype MoveManyProps = {\n /** Current parent ID - drawer will open expanded to this location */\n currentParentID?: null | number | string\n /** The hierarchy collection slug (e.g., 'folders') */\n hierarchySlug: string\n /** Icon to display in the hierarchy drawer */\n Icon?: React.ReactNode\n /** When multiple MoveMany components are rendered on the page, this will differentiate them */\n modalPrefix?: string\n /** Callback after successful move */\n onSuccess?: () => void\n /** Selections grouped by collection slug */\n selections: Record<string, { ids: (number | string)[] }>\n}\n\n/**\n * Gets the parent field name from the hierarchy config.\n */\nfunction getParentFieldName(\n hierarchyConfig: ClientCollectionConfig | undefined,\n): string | undefined {\n const config =\n hierarchyConfig?.hierarchy && typeof hierarchyConfig.hierarchy === 'object'\n ? hierarchyConfig.hierarchy\n : undefined\n return config?.parentFieldName\n}\n\nexport function MoveMany({\n currentParentID,\n hierarchySlug,\n Icon,\n modalPrefix,\n onSuccess,\n selections,\n}: MoveManyProps) {\n const { i18n, t } = useTranslation()\n const { code: locale } = useLocale()\n const { openModal } = useModal()\n const {\n config: {\n collections,\n routes: { api },\n },\n } = useConfig()\n\n const { getSelectionsWithMetadata } = useDocumentSelection()\n\n const [destination, setDestination] = useState<{\n id: null | number | string\n title: string\n } | null>(null)\n\n const confirmMoveDrawerSlug = `${modalPrefix ? `${modalPrefix}-` : ''}confirm-move-many`\n\n // Compute required collections from selection metadata\n // For related items: add their collection slug\n // For folders: add their allowedCollections values\n const requiredCollections = useMemo(() => {\n const selectionsWithMeta = getSelectionsWithMetadata()\n const required = new Set<string>()\n\n for (const [collectionSlug, { selections: items }] of Object.entries(selectionsWithMeta)) {\n if (collectionSlug === hierarchySlug) {\n // For folders, add their allowedCollections to required set\n for (const { metadata } of items) {\n if (metadata.allowedCollections) {\n for (const slug of metadata.allowedCollections) {\n required.add(slug)\n }\n }\n }\n } else {\n // For related items, add their collection slug\n required.add(collectionSlug)\n }\n }\n\n return required.size > 0 ? Array.from(required) : undefined\n }, [getSelectionsWithMetadata, hierarchySlug])\n\n // Folders being moved cannot be selected as destination (can't move into themselves)\n const disabledIds = useMemo(() => {\n const parentIds = selections[hierarchySlug]?.ids\n return parentIds?.length ? new Set(parentIds) : undefined\n }, [selections, hierarchySlug])\n\n const [HierarchyDrawer, , { closeDrawer, openDrawer }] = useHierarchyDrawer({\n disabledIds,\n filterByCollection: requiredCollections,\n hierarchyCollectionSlug: hierarchySlug,\n Icon,\n })\n\n // Calculate total count and label\n const { count, label } = useMemo(() => {\n let totalCount = 0\n const labels: string[] = []\n\n for (const [collectionSlug, { ids }] of Object.entries(selections)) {\n const config = collections.find((c) => c.slug === collectionSlug)\n\n if (config && ids.length > 0) {\n totalCount += ids.length\n const collectionLabel = getTranslation(\n ids.length > 1 ? config.labels.plural : config.labels.singular,\n i18n,\n )\n labels.push(collectionLabel)\n }\n }\n\n return {\n count: totalCount,\n label: labels.join(', '),\n }\n }, [selections, collections, i18n])\n\n const hierarchyCollectionConfig = collections.find((c) => c.slug === hierarchySlug)\n const parentFieldName = getParentFieldName(hierarchyCollectionConfig)\n\n // Check if hierarchy has a valid parentFieldName\n const canMove = parentFieldName !== undefined\n\n const handleDrawerSave = useCallback(\n ({ selections: selectionsMap }: { selections: Map<number | string, SelectionWithPath> }) => {\n if (selectionsMap.size === 0) {\n return\n }\n\n const firstSelection = selectionsMap.values().next().value\n const destinationId = firstSelection?.id\n const destinationTitle =\n firstSelection?.path?.[firstSelection.path.length - 1]?.title || String(destinationId)\n\n setDestination({ id: destinationId, title: destinationTitle })\n openModal(confirmMoveDrawerSlug)\n },\n [openModal, confirmMoveDrawerSlug],\n )\n\n const handleMoveToRoot = useCallback(() => {\n setDestination({ id: null, title: t('hierarchy:noParent') })\n openModal(confirmMoveDrawerSlug)\n }, [openModal, confirmMoveDrawerSlug, t])\n\n const handleConfirmMove = useCallback(async () => {\n if (destination === null) {\n return\n }\n\n let totalMoved = 0\n let hasErrors = false\n\n try {\n for (const [collectionSlug, { ids }] of Object.entries(selections)) {\n if (ids.length === 0) {\n continue\n }\n\n const queryString = qs.stringify(\n {\n locale,\n where: { id: { in: ids } },\n },\n { addQueryPrefix: true },\n )\n\n const url = formatAdminURL({\n apiRoute: api,\n path: `/${collectionSlug}${queryString}`,\n })\n\n const response = await requests.patch(url, {\n body: JSON.stringify({ [parentFieldName]: destination.id }),\n headers: {\n 'Accept-Language': i18n.language,\n 'Content-Type': 'application/json',\n credentials: 'include',\n },\n })\n\n const json = await response.json()\n\n if (response.status >= 400) {\n hasErrors = true\n\n if (json?.errors?.length > 0) {\n toast.error(json.message || t('error:unknown'), {\n description: json.errors\n .map((error: { message: string }) => error.message)\n .join('\\n'),\n })\n } else {\n toast.error(json?.message || t('error:unknown'))\n }\n\n continue\n }\n\n const movedCount = json?.docs?.length || 0\n totalMoved += movedCount\n\n if (json?.errors?.length > 0) {\n hasErrors = true\n toast.error(json.message, {\n description: json.errors.map((error: { message: string }) => error.message).join('\\n'),\n })\n }\n }\n\n if (totalMoved > 0) {\n const successKey =\n destination.id === null ? 'hierarchy:itemsMovedToRoot' : 'hierarchy:itemsMovedTo'\n\n toast.success(\n t(successKey, {\n destination: destination.title,\n title: label,\n }),\n )\n }\n\n if (!hasErrors || totalMoved > 0) {\n closeDrawer()\n onSuccess?.()\n }\n } catch (_err) {\n toast.error(t('error:unknown'))\n } finally {\n setDestination(null)\n }\n }, [\n closeDrawer,\n destination,\n selections,\n parentFieldName,\n locale,\n api,\n i18n,\n t,\n label,\n onSuccess,\n ])\n\n if (count === 0 || !canMove) {\n return null\n }\n\n return (\n <React.Fragment>\n <ListSelectionButton\n aria-label={t('general:move')}\n className={`${baseClass}__toggle`}\n onClick={openDrawer}\n >\n {t('general:move')}\n </ListSelectionButton>\n <HierarchyDrawer\n hasMany={false}\n initialSelections={currentParentID ? [currentParentID] : null}\n onMoveToRoot={handleMoveToRoot}\n onSave={handleDrawerSave}\n showMoveToRoot\n />\n <ConfirmationModal\n body={\n <p>\n {destination?.id === null ? (\n <Translation\n elements={{\n '1': ({ children }) => <strong>{children}</strong>,\n }}\n i18nKey=\"hierarchy:moveItemsToRootConfirmation\"\n t={t}\n variables={{\n count,\n label,\n }}\n />\n ) : (\n <Translation\n elements={{\n '1': ({ children }) => <strong>{children}</strong>,\n }}\n i18nKey=\"general:moveConfirm\"\n t={t}\n variables={{\n count,\n destination: destination?.title || '',\n label,\n }}\n />\n )}\n </p>\n }\n confirmingLabel={t('general:moving')}\n heading={t('general:confirmMove')}\n modalSlug={confirmMoveDrawerSlug}\n onConfirm={handleConfirmMove}\n />\n </React.Fragment>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["useModal","getTranslation","formatAdminURL","qs","React","useCallback","useMemo","useState","toast","useConfig","useDocumentSelection","useLocale","useTranslation","requests","ConfirmationModal","ListSelectionButton","Translation","useHierarchyModal","baseClass","getParentFieldName","hierarchyConfig","config","hierarchy","undefined","parentFieldName","MoveMany","currentParentID","hierarchySlug","Icon","modalPrefix","onSuccess","selections","i18n","t","code","locale","openModal","collections","routes","api","getSelectionsWithMetadata","destination","setDestination","confirmMoveDrawerSlug","requiredCollections","selectionsWithMeta","required","Set","collectionSlug","items","Object","entries","metadata","allowedCollections","slug","add","size","Array","from","disabledIds","parentIds","ids","length","HierarchyModal","closeModal","openHierarchyModal","filterByCollection","hierarchyCollectionSlug","count","label","totalCount","labels","find","c","collectionLabel","plural","singular","push","join","hierarchyCollectionConfig","canMove","handleDrawerSave","selectionsMap","firstSelection","values","next","value","destinationId","id","destinationTitle","path","title","String","handleMoveToRoot","handleConfirmMove","totalMoved","hasErrors","queryString","stringify","where","in","addQueryPrefix","url","apiRoute","response","patch","body","JSON","headers","language","credentials","json","status","errors","error","message","description","map","movedCount","docs","successKey","success","_err","_jsxs","Fragment","_jsx","className","onClick","hasMany","initialSelections","onMoveToRoot","onSave","showMoveToRoot","elements","1","children","i18nKey","variables","confirmingLabel","heading","modalSlug","onConfirm"],"sources":["../../../../src/elements/Hierarchy/MoveMany/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatAdminURL } from 'payload/shared'\nimport * as qs from 'qs-esm'\nimport React, { useCallback, useMemo, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport type { SelectionWithPath } from '../Modal/types.js'\n\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useDocumentSelection } from '../../../providers/DocumentSelection/index.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { requests } from '../../../utilities/api.js'\nimport { ConfirmationModal } from '../../ConfirmationModal/index.js'\nimport { ListSelectionButton } from '../../ListSelection/index.js'\nimport { Translation } from '../../Translation/index.js'\nimport { useHierarchyModal } from '../Modal/useHierarchyModal.js'\n\nexport const baseClass = 'move-many'\n\ntype MoveManyProps = {\n /** Current parent ID - modal will open expanded to this location */\n currentParentID?: null | number | string\n /** The hierarchy collection slug (e.g., 'folders') */\n hierarchySlug: string\n /** Icon to display in the hierarchy modal */\n Icon?: React.ReactNode\n /** When multiple MoveMany components are rendered on the page, this will differentiate them */\n modalPrefix?: string\n /** Callback after successful move */\n onSuccess?: () => void\n /** Selections grouped by collection slug */\n selections: Record<string, { ids: (number | string)[] }>\n}\n\n/**\n * Gets the parent field name from the hierarchy config.\n */\nfunction getParentFieldName(\n hierarchyConfig: ClientCollectionConfig | undefined,\n): string | undefined {\n const config =\n hierarchyConfig?.hierarchy && typeof hierarchyConfig.hierarchy === 'object'\n ? hierarchyConfig.hierarchy\n : undefined\n return config?.parentFieldName\n}\n\nexport function MoveMany({\n currentParentID,\n hierarchySlug,\n Icon,\n modalPrefix,\n onSuccess,\n selections,\n}: MoveManyProps) {\n const { i18n, t } = useTranslation()\n const { code: locale } = useLocale()\n const { openModal } = useModal()\n const {\n config: {\n collections,\n routes: { api },\n },\n } = useConfig()\n\n const { getSelectionsWithMetadata } = useDocumentSelection()\n\n const [destination, setDestination] = useState<{\n id: null | number | string\n title: string\n } | null>(null)\n\n const confirmMoveDrawerSlug = `${modalPrefix ? `${modalPrefix}-` : ''}confirm-move-many`\n\n // Compute required collections from selection metadata\n // For related items: add their collection slug\n // For folders: add their allowedCollections values\n const requiredCollections = useMemo(() => {\n const selectionsWithMeta = getSelectionsWithMetadata()\n const required = new Set<string>()\n\n for (const [collectionSlug, { selections: items }] of Object.entries(selectionsWithMeta)) {\n if (collectionSlug === hierarchySlug) {\n // For folders, add their allowedCollections to required set\n for (const { metadata } of items) {\n if (metadata.allowedCollections) {\n for (const slug of metadata.allowedCollections) {\n required.add(slug)\n }\n }\n }\n } else {\n // For related items, add their collection slug\n required.add(collectionSlug)\n }\n }\n\n return required.size > 0 ? Array.from(required) : undefined\n }, [getSelectionsWithMetadata, hierarchySlug])\n\n // Folders being moved cannot be selected as destination (can't move into themselves)\n const disabledIds = useMemo(() => {\n const parentIds = selections[hierarchySlug]?.ids\n return parentIds?.length ? new Set(parentIds) : undefined\n }, [selections, hierarchySlug])\n\n const [HierarchyModal, , { closeModal, openModal: openHierarchyModal }] = useHierarchyModal({\n disabledIds,\n filterByCollection: requiredCollections,\n hierarchyCollectionSlug: hierarchySlug,\n Icon,\n })\n\n // Calculate total count and label\n const { count, label } = useMemo(() => {\n let totalCount = 0\n const labels: string[] = []\n\n for (const [collectionSlug, { ids }] of Object.entries(selections)) {\n const config = collections.find((c) => c.slug === collectionSlug)\n\n if (config && ids.length > 0) {\n totalCount += ids.length\n const collectionLabel = getTranslation(\n ids.length > 1 ? config.labels.plural : config.labels.singular,\n i18n,\n )\n labels.push(collectionLabel)\n }\n }\n\n return {\n count: totalCount,\n label: labels.join(', '),\n }\n }, [selections, collections, i18n])\n\n const hierarchyCollectionConfig = collections.find((c) => c.slug === hierarchySlug)\n const parentFieldName = getParentFieldName(hierarchyCollectionConfig)\n\n // Check if hierarchy has a valid parentFieldName\n const canMove = parentFieldName !== undefined\n\n const handleDrawerSave = useCallback(\n ({ selections: selectionsMap }: { selections: Map<number | string, SelectionWithPath> }) => {\n if (selectionsMap.size === 0) {\n return\n }\n\n const firstSelection = selectionsMap.values().next().value\n const destinationId = firstSelection?.id\n const destinationTitle =\n firstSelection?.path?.[firstSelection.path.length - 1]?.title || String(destinationId)\n\n setDestination({ id: destinationId, title: destinationTitle })\n openModal(confirmMoveDrawerSlug)\n },\n [openModal, confirmMoveDrawerSlug],\n )\n\n const handleMoveToRoot = useCallback(() => {\n setDestination({ id: null, title: t('hierarchy:noParent') })\n openModal(confirmMoveDrawerSlug)\n }, [openModal, confirmMoveDrawerSlug, t])\n\n const handleConfirmMove = useCallback(async () => {\n if (destination === null) {\n return\n }\n\n let totalMoved = 0\n let hasErrors = false\n\n try {\n for (const [collectionSlug, { ids }] of Object.entries(selections)) {\n if (ids.length === 0) {\n continue\n }\n\n const queryString = qs.stringify(\n {\n locale,\n where: { id: { in: ids } },\n },\n { addQueryPrefix: true },\n )\n\n const url = formatAdminURL({\n apiRoute: api,\n path: `/${collectionSlug}${queryString}`,\n })\n\n const response = await requests.patch(url, {\n body: JSON.stringify({ [parentFieldName]: destination.id }),\n headers: {\n 'Accept-Language': i18n.language,\n 'Content-Type': 'application/json',\n credentials: 'include',\n },\n })\n\n const json = await response.json()\n\n if (response.status >= 400) {\n hasErrors = true\n\n if (json?.errors?.length > 0) {\n toast.error(json.message || t('error:unknown'), {\n description: json.errors\n .map((error: { message: string }) => error.message)\n .join('\\n'),\n })\n } else {\n toast.error(json?.message || t('error:unknown'))\n }\n\n continue\n }\n\n const movedCount = json?.docs?.length || 0\n totalMoved += movedCount\n\n if (json?.errors?.length > 0) {\n hasErrors = true\n toast.error(json.message, {\n description: json.errors.map((error: { message: string }) => error.message).join('\\n'),\n })\n }\n }\n\n if (totalMoved > 0) {\n const successKey =\n destination.id === null ? 'hierarchy:itemsMovedToRoot' : 'hierarchy:itemsMovedTo'\n\n toast.success(\n t(successKey, {\n destination: destination.title,\n title: label,\n }),\n )\n }\n\n if (!hasErrors || totalMoved > 0) {\n closeModal()\n onSuccess?.()\n }\n } catch (_err) {\n toast.error(t('error:unknown'))\n } finally {\n setDestination(null)\n }\n }, [closeModal, destination, selections, parentFieldName, locale, api, i18n, t, label, onSuccess])\n\n if (count === 0 || !canMove) {\n return null\n }\n\n return (\n <React.Fragment>\n <ListSelectionButton\n aria-label={t('general:move')}\n className={`${baseClass}__toggle`}\n onClick={openHierarchyModal}\n >\n {t('general:move')}\n </ListSelectionButton>\n <HierarchyModal\n hasMany={false}\n initialSelections={currentParentID ? [currentParentID] : null}\n onMoveToRoot={handleMoveToRoot}\n onSave={handleDrawerSave}\n showMoveToRoot\n />\n <ConfirmationModal\n body={\n <p>\n {destination?.id === null ? (\n <Translation\n elements={{\n '1': ({ children }) => <strong>{children}</strong>,\n }}\n i18nKey=\"hierarchy:moveItemsToRootConfirmation\"\n t={t}\n variables={{\n count,\n label,\n }}\n />\n ) : (\n <Translation\n elements={{\n '1': ({ children }) => <strong>{children}</strong>,\n }}\n i18nKey=\"general:moveConfirm\"\n t={t}\n variables={{\n count,\n destination: destination?.title || '',\n label,\n }}\n />\n )}\n </p>\n }\n confirmingLabel={t('general:moving')}\n heading={t('general:confirmMove')}\n modalSlug={confirmMoveDrawerSlug}\n onConfirm={handleConfirmMove}\n />\n </React.Fragment>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/LivePreview/Toolbar/SizeInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAKrD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC3C,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAA;CACjB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/LivePreview/Toolbar/SizeInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAKrD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC3C,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAA;CACjB,CA2FA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","NumberInput","useLivePreviewContext","useTranslation","baseClass","PreviewFrameSizeInput","props","$","axis","breakpoint","measuredDeviceSize","setBreakpoint","setSize","size","zoom","t","internalState","setInternalState","useState","width","height","t0","value","newValue","Number","type","toFixed","handleChange","t1","direction","currentValue","newValue_0","handleStep","t2","t3","t4","t5","e","target","_jsx","ariaLabel","className","min","onChange","onStep","path","prefix","step"],"sources":["../../../../../src/elements/LivePreview/Toolbar/SizeInput/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useEffect } from 'react'\n\nimport { NumberInput } from '../../../../fields/Number/index.js'\nimport { useLivePreviewContext } from '../../../../providers/LivePreview/context.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport './index.css'\n\nconst baseClass = 'toolbar-input'\n\nexport const PreviewFrameSizeInput: React.FC<{\n axis?: 'x' | 'y'\n}> = (props) => {\n const { axis } = props\n\n const { breakpoint, measuredDeviceSize, setBreakpoint, setSize, size, zoom } =\n useLivePreviewContext()\n\n const { t } = useTranslation()\n\n const [internalState, setInternalState] = React.useState<number>(\n (axis === 'x' ? measuredDeviceSize?.width : measuredDeviceSize?.height) || 0,\n )\n\n // when the input is changed manually, we need to set the breakpoint as `custom`\n // this will then allow us to set an explicit width and height\n const handleChange = useCallback(\n (value: string) => {\n let newValue = Number(value)\n\n if (newValue < 0) {\n newValue = 0\n }\n\n setInternalState(newValue)\n setBreakpoint('custom')\n\n // be sure to set _both_ axis values to so that the other axis doesn't fallback to 0 on initial change\n // this is because the `responsive` size is '100%' in CSS, and `0` in initial state\n setSize({\n type: 'reset',\n value: {\n height: axis === 'y' ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,\n width: axis === 'x' ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom,\n },\n })\n },\n [axis, setBreakpoint, measuredDeviceSize, setSize, zoom],\n )\n\n const handleStep = useCallback(\n (direction: 'down' | 'up') => {\n const currentValue = internalState || 0\n let newValue = direction === 'up' ? currentValue + 1 : currentValue - 1\n\n if (newValue < 0) {\n newValue = 0\n }\n\n setInternalState(newValue)\n setBreakpoint('custom')\n\n setSize({\n type: 'reset',\n value: {\n height: axis === 'y' ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,\n width: axis === 'x' ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom,\n },\n })\n },\n [axis, internalState, measuredDeviceSize, setBreakpoint, setSize, zoom],\n )\n\n // if the breakpoint is `responsive` then the device's div will have `100%` width and height\n // so we need to take the measurements provided by `actualDeviceSize` and sync internal state\n useEffect(() => {\n if (breakpoint === 'responsive' && measuredDeviceSize) {\n if (axis === 'x') {\n setInternalState(Number(measuredDeviceSize.width.toFixed(0)) * zoom)\n } else {\n setInternalState(Number(measuredDeviceSize.height.toFixed(0)) * zoom)\n }\n }\n\n if (breakpoint !== 'responsive' && size) {\n setInternalState(axis === 'x' ? size.width : size.height)\n }\n }, [breakpoint, axis, measuredDeviceSize, size, zoom])\n\n return (\n <NumberInput\n ariaLabel={axis === 'x' ? t('upload:width') : t('upload:height')}\n className={baseClass}\n min={0}\n onChange={(e) => handleChange(e.target.value)}\n onStep={handleStep}\n path={axis === 'x' ? 'live-preview-width' : 'live-preview-height'}\n prefix={axis === 'x' ? 'W' : 'H'}\n step={1}\n value={internalState || 0}\n />\n )\n}\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","NumberInput","useLivePreviewContext","useTranslation","baseClass","PreviewFrameSizeInput","props","$","axis","breakpoint","measuredDeviceSize","setBreakpoint","setSize","size","zoom","t","internalState","setInternalState","useState","width","height","t0","value","newValue","Number","type","toFixed","handleChange","t1","direction","currentValue","newValue_0","handleStep","t2","t3","t4","t5","e","target","_jsx","ariaLabel","className","min","onChange","onStep","path","prefix","step"],"sources":["../../../../../src/elements/LivePreview/Toolbar/SizeInput/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useEffect } from 'react'\n\nimport { NumberInput } from '../../../../fields/Number/index.js'\nimport { useLivePreviewContext } from '../../../../providers/LivePreview/context.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport './index.css'\n\nconst baseClass = 'toolbar-input'\n\nexport const PreviewFrameSizeInput: React.FC<{\n axis?: 'x' | 'y'\n}> = (props) => {\n const { axis } = props\n\n const { breakpoint, measuredDeviceSize, setBreakpoint, setSize, size, zoom } =\n useLivePreviewContext()\n\n const { t } = useTranslation()\n\n const [internalState, setInternalState] = React.useState<number>(\n (axis === 'x' ? measuredDeviceSize?.width : measuredDeviceSize?.height) || 0,\n )\n\n // when the input is changed manually, we need to set the breakpoint as `custom`\n // this will then allow us to set an explicit width and height\n const handleChange = useCallback(\n (value: string) => {\n let newValue = Number(value)\n\n if (newValue < 0) {\n newValue = 0\n }\n\n setInternalState(newValue)\n setBreakpoint('custom')\n\n // be sure to set _both_ axis values to so that the other axis doesn't fallback to 0 on initial change\n // this is because the `responsive` size is '100%' in CSS, and `0` in initial state\n setSize({\n type: 'reset',\n value: {\n height: axis === 'y' ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,\n width: axis === 'x' ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom,\n },\n })\n },\n [axis, setBreakpoint, measuredDeviceSize, setSize, zoom],\n )\n\n const handleStep = useCallback(\n (direction: 'down' | 'up') => {\n const currentValue = internalState || 0\n let newValue = direction === 'up' ? currentValue + 1 : currentValue - 1\n\n if (newValue < 0) {\n newValue = 0\n }\n\n setInternalState(newValue)\n setBreakpoint('custom')\n\n setSize({\n type: 'reset',\n value: {\n height: axis === 'y' ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,\n width: axis === 'x' ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom,\n },\n })\n },\n [axis, internalState, measuredDeviceSize, setBreakpoint, setSize, zoom],\n )\n\n // if the breakpoint is `responsive` then the device's div will have `100%` width and height\n // so we need to take the measurements provided by `actualDeviceSize` and sync internal state\n useEffect(() => {\n if (breakpoint === 'responsive' && measuredDeviceSize) {\n if (axis === 'x') {\n setInternalState(Number(measuredDeviceSize.width.toFixed(0)) * zoom)\n } else {\n setInternalState(Number(measuredDeviceSize.height.toFixed(0)) * zoom)\n }\n }\n\n if (breakpoint !== 'responsive' && size) {\n setInternalState(axis === 'x' ? size.width : size.height)\n }\n }, [breakpoint, axis, measuredDeviceSize, size, zoom])\n\n return (\n <NumberInput\n ariaLabel={axis === 'x' ? t('upload:width') : t('upload:height')}\n className={baseClass}\n min={0}\n onChange={(e) => handleChange(e.target.value)}\n onStep={handleStep}\n path={axis === 'x' ? 'live-preview-width' : 'live-preview-height'}\n prefix={axis === 'x' ? 'W' : 'H'}\n size=\"medium\"\n step={1}\n value={internalState || 0}\n />\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
.rs__control {
|
|
8
8
|
position: relative;
|
|
9
9
|
width: 100%;
|
|
10
|
-
min-height: var(--field-min-height);
|
|
10
|
+
min-height: var(--field-min-height-large);
|
|
11
11
|
background: var(--field-color-bg);
|
|
12
12
|
border: var(--stroke-width-small) solid var(--field-color-border);
|
|
13
13
|
border-radius: var(--field-border-radius);
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
position: absolute;
|
|
58
58
|
right: var(--spacer-1);
|
|
59
59
|
top: -1px; /* Adjust for border */
|
|
60
|
-
min-height: var(--field-min-height);
|
|
60
|
+
min-height: var(--field-min-height-large);
|
|
61
61
|
display: flex;
|
|
62
62
|
}
|
|
63
63
|
|