@payloadcms/ui 3.59.0-internal.152bf35 → 3.59.0-internal.3d25465
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/elements/DocumentLocked/index.js +1 -1
- package/dist/elements/DocumentLocked/index.js.map +1 -1
- package/dist/elements/Nav/context.d.ts +6 -0
- package/dist/elements/Nav/context.d.ts.map +1 -1
- package/dist/elements/Nav/context.js +6 -0
- package/dist/elements/Nav/context.js.map +1 -1
- package/dist/elements/PageControls/index.d.ts +9 -0
- package/dist/elements/PageControls/index.d.ts.map +1 -1
- package/dist/elements/PageControls/index.js +101 -45
- package/dist/elements/PageControls/index.js.map +1 -1
- package/dist/elements/RelationshipTable/index.d.ts.map +1 -1
- package/dist/elements/RelationshipTable/index.js +3 -2
- package/dist/elements/RelationshipTable/index.js.map +1 -1
- package/dist/elements/StickyToolbar/index.d.ts +3 -0
- package/dist/elements/StickyToolbar/index.d.ts.map +1 -1
- package/dist/elements/StickyToolbar/index.js +3 -0
- package/dist/elements/StickyToolbar/index.js.map +1 -1
- package/dist/elements/Table/index.scss +1 -0
- package/dist/exports/client/index.d.ts +4 -1
- package/dist/exports/client/index.d.ts.map +1 -1
- package/dist/exports/client/index.js +12 -12
- package/dist/exports/client/index.js.map +4 -4
- package/dist/fields/Upload/RelationshipContent/index.js +1 -1
- package/dist/fields/Upload/RelationshipContent/index.js.map +1 -1
- package/dist/hooks/useControllableState.d.ts +2 -0
- package/dist/hooks/useControllableState.d.ts.map +1 -1
- package/dist/hooks/useControllableState.js +44 -11
- package/dist/hooks/useControllableState.js.map +1 -1
- package/dist/providers/LivePreview/index.d.ts.map +1 -1
- package/dist/providers/LivePreview/index.js +3 -0
- package/dist/providers/LivePreview/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/utilities/getColumns.js +1 -1
- package/dist/utilities/getColumns.js.map +1 -1
- package/dist/views/Edit/index.d.ts.map +1 -1
- package/dist/views/Edit/index.js +5 -1
- package/dist/views/Edit/index.js.map +1 -1
- package/package.json +5 -5
|
@@ -91,7 +91,7 @@ export function RelationshipContent(props) {
|
|
|
91
91
|
}
|
|
92
92
|
const generateMetaText = t5;
|
|
93
93
|
const metaText = withMeta ? generateMetaText(mimeType, byteSize) : "";
|
|
94
|
-
const previewAllowed = displayPreview ?? collectionConfig
|
|
94
|
+
const previewAllowed = displayPreview ?? collectionConfig?.upload?.displayPreview ?? true;
|
|
95
95
|
let t6;
|
|
96
96
|
if ($[9] !== className) {
|
|
97
97
|
t6 = [baseClass, className].filter(Boolean);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","formatFilesize","React","Button","useDocumentDrawer","ThumbnailComponent","useConfig","baseClass","RelationshipContent","props","$","id","allowEdit","allowRemove","alt","byteSize","className","collectionSlug","displayPreview","filename","mimeType","onRemove","reloadDoc","src","thumbnailSrc","withMeta","t0","x","y","undefined","config","collectionConfig","collections","find","collection","slug","t1","t2","DocumentDrawer","t3","openDrawer","t4","t5","doc","onSave","generateMetaText","mimeType_0","size","sections","push","join","metaText","previewAllowed","upload","t6","filter","Boolean","_jsxs","children","_jsx","fileSrc","href","target","buttonStyle","icon","iconStyle","onClick"],"sources":["../../../../src/fields/Upload/RelationshipContent/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TypeWithID } from 'payload'\n\nimport { formatFilesize, isImage } from 'payload/shared'\nimport React from 'react'\n\nimport type { ReloadDoc } from '../types.js'\n\nimport { Button } from '../../../elements/Button/index.js'\nimport { useDocumentDrawer } from '../../../elements/DocumentDrawer/index.js'\nimport { ThumbnailComponent } from '../../../elements/Thumbnail/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport './index.scss'\n\nconst baseClass = 'upload-relationship-details'\n\ntype Props = {\n readonly allowEdit?: boolean\n readonly allowRemove?: boolean\n readonly alt: string\n readonly byteSize: number\n readonly className?: string\n readonly collectionSlug: string\n readonly displayPreview?: boolean\n readonly filename: string\n readonly id?: number | string\n readonly mimeType: string\n readonly onRemove: () => void\n readonly reloadDoc: ReloadDoc\n readonly src: string\n readonly thumbnailSrc: string\n readonly withMeta?: boolean\n readonly x?: number\n readonly y?: number\n}\nexport function RelationshipContent(props: Props) {\n const {\n id,\n allowEdit,\n allowRemove,\n alt,\n byteSize,\n className,\n collectionSlug,\n displayPreview,\n filename,\n mimeType,\n onRemove,\n reloadDoc,\n src,\n thumbnailSrc,\n withMeta = true,\n x,\n y,\n } = props\n\n const { config } = useConfig()\n const collectionConfig =\n 'collections' in config\n ? config.collections.find((collection) => collection.slug === collectionSlug)\n : undefined\n\n const [DocumentDrawer, _, { openDrawer }] = useDocumentDrawer({\n id: src ? id : undefined,\n collectionSlug,\n })\n\n const onSave = React.useCallback(\n async ({ doc }: { doc: TypeWithID }) => reloadDoc(doc.id, collectionSlug),\n [reloadDoc, collectionSlug],\n )\n\n function generateMetaText(mimeType: string, size: number): string {\n const sections: string[] = []\n if (size) {\n sections.push(formatFilesize(size))\n }\n\n if (x && y) {\n sections.push(`${x}x${y}`)\n }\n\n if (mimeType) {\n sections.push(mimeType)\n }\n\n return sections.join(' — ')\n }\n\n const metaText = withMeta ? generateMetaText(mimeType, byteSize) : ''\n const previewAllowed = displayPreview ?? collectionConfig
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","formatFilesize","React","Button","useDocumentDrawer","ThumbnailComponent","useConfig","baseClass","RelationshipContent","props","$","id","allowEdit","allowRemove","alt","byteSize","className","collectionSlug","displayPreview","filename","mimeType","onRemove","reloadDoc","src","thumbnailSrc","withMeta","t0","x","y","undefined","config","collectionConfig","collections","find","collection","slug","t1","t2","DocumentDrawer","t3","openDrawer","t4","t5","doc","onSave","generateMetaText","mimeType_0","size","sections","push","join","metaText","previewAllowed","upload","t6","filter","Boolean","_jsxs","children","_jsx","fileSrc","href","target","buttonStyle","icon","iconStyle","onClick"],"sources":["../../../../src/fields/Upload/RelationshipContent/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TypeWithID } from 'payload'\n\nimport { formatFilesize, isImage } from 'payload/shared'\nimport React from 'react'\n\nimport type { ReloadDoc } from '../types.js'\n\nimport { Button } from '../../../elements/Button/index.js'\nimport { useDocumentDrawer } from '../../../elements/DocumentDrawer/index.js'\nimport { ThumbnailComponent } from '../../../elements/Thumbnail/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport './index.scss'\n\nconst baseClass = 'upload-relationship-details'\n\ntype Props = {\n readonly allowEdit?: boolean\n readonly allowRemove?: boolean\n readonly alt: string\n readonly byteSize: number\n readonly className?: string\n readonly collectionSlug: string\n readonly displayPreview?: boolean\n readonly filename: string\n readonly id?: number | string\n readonly mimeType: string\n readonly onRemove: () => void\n readonly reloadDoc: ReloadDoc\n readonly src: string\n readonly thumbnailSrc: string\n readonly withMeta?: boolean\n readonly x?: number\n readonly y?: number\n}\nexport function RelationshipContent(props: Props) {\n const {\n id,\n allowEdit,\n allowRemove,\n alt,\n byteSize,\n className,\n collectionSlug,\n displayPreview,\n filename,\n mimeType,\n onRemove,\n reloadDoc,\n src,\n thumbnailSrc,\n withMeta = true,\n x,\n y,\n } = props\n\n const { config } = useConfig()\n const collectionConfig =\n 'collections' in config\n ? config.collections.find((collection) => collection.slug === collectionSlug)\n : undefined\n\n const [DocumentDrawer, _, { openDrawer }] = useDocumentDrawer({\n id: src ? id : undefined,\n collectionSlug,\n })\n\n const onSave = React.useCallback(\n async ({ doc }: { doc: TypeWithID }) => reloadDoc(doc.id, collectionSlug),\n [reloadDoc, collectionSlug],\n )\n\n function generateMetaText(mimeType: string, size: number): string {\n const sections: string[] = []\n if (size) {\n sections.push(formatFilesize(size))\n }\n\n if (x && y) {\n sections.push(`${x}x${y}`)\n }\n\n if (mimeType) {\n sections.push(mimeType)\n }\n\n return sections.join(' — ')\n }\n\n const metaText = withMeta ? generateMetaText(mimeType, byteSize) : ''\n const previewAllowed = displayPreview ?? collectionConfig?.upload?.displayPreview ?? true\n\n return (\n <div className={[baseClass, className].filter(Boolean).join(' ')}>\n <div className={`${baseClass}__imageAndDetails`}>\n {previewAllowed && (\n <ThumbnailComponent\n alt={alt}\n className={`${baseClass}__thumbnail`}\n filename={filename}\n fileSrc={thumbnailSrc}\n size=\"small\"\n />\n )}\n <div className={`${baseClass}__details`}>\n <p className={`${baseClass}__filename`}>\n {src ? (\n <a href={src} target=\"_blank\">\n {filename}\n </a>\n ) : (\n filename\n )}\n </p>\n {withMeta ? <p className={`${baseClass}__meta`}>{metaText}</p> : null}\n </div>\n </div>\n\n {allowEdit !== false || allowRemove !== false ? (\n <div className={`${baseClass}__actions`}>\n {allowEdit !== false ? (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__edit`}\n icon=\"edit\"\n iconStyle=\"none\"\n onClick={openDrawer}\n />\n ) : null}\n {allowRemove !== false ? (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n iconStyle=\"none\"\n onClick={() => onRemove()}\n />\n ) : null}\n <DocumentDrawer onSave={onSave} />\n </div>\n ) : null}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* A hook for managing state that can be controlled by props but also overridden locally.
|
|
3
3
|
* Props always take precedence if they change, but local state can override them temporarily.
|
|
4
|
+
*
|
|
5
|
+
* @internal - may change or be removed without a major version bump
|
|
4
6
|
*/
|
|
5
7
|
export declare function useControllableState<T>(propValue: T, defaultValue?: T): [T, (value: ((prev: T) => T) | T) => void];
|
|
6
8
|
//# sourceMappingURL=useControllableState.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useControllableState.d.ts","sourceRoot":"","sources":["../../src/hooks/useControllableState.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useControllableState.d.ts","sourceRoot":"","sources":["../../src/hooks/useControllableState.ts"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,EACpC,SAAS,EAAE,CAAC,EACZ,YAAY,CAAC,EAAE,CAAC,GACf,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,CAkB5C"}
|
|
@@ -1,21 +1,54 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { c as _c } from "react/compiler-runtime";
|
|
1
4
|
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
2
5
|
/**
|
|
3
6
|
* A hook for managing state that can be controlled by props but also overridden locally.
|
|
4
7
|
* Props always take precedence if they change, but local state can override them temporarily.
|
|
8
|
+
*
|
|
9
|
+
* @internal - may change or be removed without a major version bump
|
|
5
10
|
*/
|
|
6
11
|
export function useControllableState(propValue, defaultValue) {
|
|
12
|
+
const $ = _c(6);
|
|
7
13
|
const [localValue, setLocalValue] = useState(propValue ?? defaultValue);
|
|
8
14
|
const initialRenderRef = useRef(true);
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
15
|
+
let t0;
|
|
16
|
+
let t1;
|
|
17
|
+
if ($[0] !== propValue) {
|
|
18
|
+
t0 = () => {
|
|
19
|
+
if (initialRenderRef.current) {
|
|
20
|
+
initialRenderRef.current = false;
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
setLocalValue(propValue);
|
|
24
|
+
};
|
|
25
|
+
t1 = [propValue];
|
|
26
|
+
$[0] = propValue;
|
|
27
|
+
$[1] = t0;
|
|
28
|
+
$[2] = t1;
|
|
29
|
+
} else {
|
|
30
|
+
t0 = $[1];
|
|
31
|
+
t1 = $[2];
|
|
32
|
+
}
|
|
33
|
+
useEffect(t0, t1);
|
|
34
|
+
let t2;
|
|
35
|
+
if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
|
|
36
|
+
t2 = value => {
|
|
37
|
+
setLocalValue(value);
|
|
38
|
+
};
|
|
39
|
+
$[3] = t2;
|
|
40
|
+
} else {
|
|
41
|
+
t2 = $[3];
|
|
42
|
+
}
|
|
43
|
+
const setValue = t2;
|
|
44
|
+
let t3;
|
|
45
|
+
if ($[4] !== localValue) {
|
|
46
|
+
t3 = [localValue, setValue];
|
|
47
|
+
$[4] = localValue;
|
|
48
|
+
$[5] = t3;
|
|
49
|
+
} else {
|
|
50
|
+
t3 = $[5];
|
|
51
|
+
}
|
|
52
|
+
return t3;
|
|
20
53
|
}
|
|
21
54
|
//# sourceMappingURL=useControllableState.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useControllableState.js","names":["useCallback","useEffect","useRef","useState","useControllableState","propValue","defaultValue","localValue","setLocalValue","initialRenderRef","current","
|
|
1
|
+
{"version":3,"file":"useControllableState.js","names":["c","_c","useCallback","useEffect","useRef","useState","useControllableState","propValue","defaultValue","$","localValue","setLocalValue","initialRenderRef","t0","t1","current","t2","Symbol","for","value","setValue","t3"],"sources":["../../src/hooks/useControllableState.ts"],"sourcesContent":["'use client'\nimport { useCallback, useEffect, useRef, useState } from 'react'\n\n/**\n * A hook for managing state that can be controlled by props but also overridden locally.\n * Props always take precedence if they change, but local state can override them temporarily.\n *\n * @internal - may change or be removed without a major version bump\n */\nexport function useControllableState<T>(\n propValue: T,\n defaultValue?: T,\n): [T, (value: ((prev: T) => T) | T) => void] {\n const [localValue, setLocalValue] = useState<T>(propValue ?? defaultValue)\n const initialRenderRef = useRef(true)\n\n useEffect(() => {\n if (initialRenderRef.current) {\n initialRenderRef.current = false\n return\n }\n\n setLocalValue(propValue)\n }, [propValue])\n\n const setValue = useCallback((value: ((prev: T) => T) | T) => {\n setLocalValue(value)\n }, [])\n\n return [localValue, setValue]\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AACA,SAASC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ;AAEzD;;;;;;AAMA,OAAO,SAAAC,qBAAAC,SAAA,EAAAC,YAAA;EAAA,MAAAC,CAAA,GAAAR,EAAA;EAIL,OAAAS,UAAA,EAAAC,aAAA,IAAoCN,QAAA,CAAYE,SAAA,IAAaC,YAAA;EAC7D,MAAAI,gBAAA,GAAyBR,MAAA,KAAO;EAAA,IAAAS,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAL,CAAA,QAAAF,SAAA;IAEtBM,EAAA,GAAAA,CAAA;MAAA,IACJD,gBAAA,CAAAG,OAAA;QACFH,gBAAA,CAAAG,OAAA;QAAA;MAAA;MAIFJ,aAAA,CAAcJ,SAAA;IAAA;IACbO,EAAA,IAACP,SAAA;IAAUE,CAAA,MAAAF,SAAA;IAAAE,CAAA,MAAAI,EAAA;IAAAJ,CAAA,MAAAK,EAAA;EAAA;IAAAD,EAAA,GAAAJ,CAAA;IAAAK,EAAA,GAAAL,CAAA;EAAA;EAPdN,SAAA,CAAUU,EAOV,EAAGC,EAAW;EAAA,IAAAE,EAAA;EAAA,IAAAP,CAAA,QAAAQ,MAAA,CAAAC,GAAA;IAEeF,EAAA,GAAAG,KAAA;MAC3BR,aAAA,CAAcQ,KAAA;IAAA;IAChBV,CAAA,MAAAO,EAAA;EAAA;IAAAA,EAAA,GAAAP,CAAA;EAAA;EAFA,MAAAW,QAAA,GAAiBJ,EAEZ;EAAA,IAAAK,EAAA;EAAA,IAAAZ,CAAA,QAAAC,UAAA;IAEEW,EAAA,IAACX,UAAA,EAAYU,QAAA;IAASX,CAAA,MAAAC,UAAA;IAAAD,CAAA,MAAAY,EAAA;EAAA;IAAAA,EAAA,GAAAZ,CAAA;EAAA;EAAA,OAAtBY,EAAsB;AAAA","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/providers/LivePreview/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAyB,iBAAiB,EAAsB,MAAM,SAAS,CAAA;AAG3F,OAAO,KAA4D,MAAM,OAAO,CAAA;AAEhF,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAU1D,MAAM,MAAM,wBAAwB,GAAG;IACrC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,UAAU,CAAC,EAAE;QACX,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,gBAAgB,EAAE,OAAO,CAAA;CAC1B,GAAG,IAAI,CAAC,sBAAsB,EAAE,sBAAsB,GAAG,KAAK,CAAC,CAAA;AAEhE,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/providers/LivePreview/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAyB,iBAAiB,EAAsB,MAAM,SAAS,CAAA;AAG3F,OAAO,KAA4D,MAAM,OAAO,CAAA;AAEhF,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAU1D,MAAM,MAAM,wBAAwB,GAAG;IACrC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,UAAU,CAAC,EAAE;QACX,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,gBAAgB,EAAE,OAAO,CAAA;CAC1B,GAAG,IAAI,CAAC,sBAAsB,EAAE,sBAAsB,GAAG,KAAK,CAAC,CAAA;AAEhE,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA2PlE,CAAA"}
|
|
@@ -72,6 +72,9 @@ export const LivePreviewProvider = ({
|
|
|
72
72
|
if (typeof _incomingURL === 'string') {
|
|
73
73
|
incomingURL = formatAbsoluteURL(_incomingURL);
|
|
74
74
|
}
|
|
75
|
+
if (!incomingURL) {
|
|
76
|
+
setIsLivePreviewing(false);
|
|
77
|
+
}
|
|
75
78
|
if (incomingURL !== url) {
|
|
76
79
|
setAppIsReady(false);
|
|
77
80
|
setURL(incomingURL);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["DndContext","React","useCallback","useEffect","useMemo","useRef","useState","usePopupWindow","useDocumentInfo","usePreferences","formatAbsoluteURL","customCollisionDetection","LivePreviewContext","sizeReducer","LivePreviewProvider","breakpoints","incomingBreakpoints","children","isLivePreviewEnabled","isLivePreviewing","incomingIsLivePreviewing","typeofLivePreviewURL","url","urlFromProps","previewWindowType","setPreviewWindowType","setIsLivePreviewing","name","height","label","width","setURL","isPopupOpen","openPopupWindow","popupRef","eventType","appIsReady","setAppIsReady","listeningForMessages","setListeningForMessages","collectionSlug","globalSlug","isFirstRender","setPreference","iframeRef","loadedURL","setLoadedURL","zoom","setZoom","position","setPosition","x","y","size","setSize","useReducer","measuredDeviceSize","setMeasuredDeviceSize","breakpoint","setBreakpoint","setLivePreviewURL","_incomingURL","incomingURL","handleDragEnd","ev","over","id","newPos","delta","setWidth","type","value","setHeight","foundBreakpoint","find","bp","handleMessage","event","startsWith","origin","data","ready","window","addEventListener","removeEventListener","handleWindowChange","newPreviewWindowType","current","editViewType","_jsx","setToolbarPosition","toolbarPosition","collisionDetection","onDragEnd"],"sources":["../../../src/providers/LivePreview/index.tsx"],"sourcesContent":["'use client'\nimport type { CollectionPreferences, LivePreviewConfig, LivePreviewURLType } from 'payload'\n\nimport { DndContext } from '@dnd-kit/core'\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\n\nimport type { LivePreviewContextType } from './context.js'\n\nimport { usePopupWindow } from '../../hooks/usePopupWindow.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { formatAbsoluteURL } from '../../utilities/formatAbsoluteURL.js'\nimport { customCollisionDetection } from './collisionDetection.js'\nimport { LivePreviewContext } from './context.js'\nimport { sizeReducer } from './sizeReducer.js'\n\nexport type LivePreviewProviderProps = {\n appIsReady?: boolean\n breakpoints?: LivePreviewConfig['breakpoints']\n children: React.ReactNode\n deviceSize?: {\n height: number\n width: number\n }\n isLivePreviewEnabled?: boolean\n isLivePreviewing: boolean\n} & Pick<LivePreviewContextType, 'typeofLivePreviewURL' | 'url'>\n\nexport const LivePreviewProvider: React.FC<LivePreviewProviderProps> = ({\n breakpoints: incomingBreakpoints,\n children,\n isLivePreviewEnabled,\n isLivePreviewing: incomingIsLivePreviewing,\n typeofLivePreviewURL,\n url: urlFromProps,\n}) => {\n const [previewWindowType, setPreviewWindowType] = useState<'iframe' | 'popup'>('iframe')\n const [isLivePreviewing, setIsLivePreviewing] = useState(incomingIsLivePreviewing)\n\n const breakpoints: LivePreviewConfig['breakpoints'] = useMemo(\n () => [\n ...(incomingBreakpoints || []),\n {\n name: 'responsive',\n height: '100%',\n label: 'Responsive',\n width: '100%',\n },\n ],\n [incomingBreakpoints],\n )\n\n const [url, setURL] = useState<string>('')\n\n const { isPopupOpen, openPopupWindow, popupRef } = usePopupWindow({\n eventType: 'payload-live-preview',\n url,\n })\n\n const [appIsReady, setAppIsReady] = useState(false)\n const [listeningForMessages, setListeningForMessages] = useState(false)\n\n const { collectionSlug, globalSlug } = useDocumentInfo()\n\n const isFirstRender = useRef(true)\n\n const { setPreference } = usePreferences()\n\n const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n const [loadedURL, setLoadedURL] = useState<string>()\n\n const [zoom, setZoom] = useState(1)\n\n const [position, setPosition] = useState({ x: 0, y: 0 })\n\n const [size, setSize] = React.useReducer(sizeReducer, { height: 0, width: 0 })\n\n const [measuredDeviceSize, setMeasuredDeviceSize] = useState({\n height: 0,\n width: 0,\n })\n\n const [breakpoint, setBreakpoint] =\n React.useState<LivePreviewConfig['breakpoints'][0]['name']>('responsive')\n\n /**\n * A \"middleware\" callback fn that does some additional work before `setURL`.\n * This is what we provide through context, bc it:\n * - ensures the URL is absolute\n * - resets `appIsReady` to `false` while the new URL is loading\n */\n const setLivePreviewURL = useCallback<LivePreviewContextType['setURL']>(\n (_incomingURL) => {\n let incomingURL: LivePreviewURLType\n\n if (typeof _incomingURL === 'string') {\n incomingURL = formatAbsoluteURL(_incomingURL)\n }\n\n if (incomingURL !== url) {\n setAppIsReady(false)\n setURL(incomingURL)\n }\n },\n [url],\n )\n\n /**\n * `url` needs to be relative to the window, which cannot be done on initial render.\n */\n useEffect(() => {\n if (typeof urlFromProps === 'string') {\n setURL(formatAbsoluteURL(urlFromProps))\n }\n }, [urlFromProps])\n\n // The toolbar needs to freely drag and drop around the page\n const handleDragEnd = (ev) => {\n // only update position if the toolbar is completely within the preview area\n // otherwise reset it back to the previous position\n // TODO: reset to the nearest edge of the preview area\n if (ev.over && ev.over.id === 'live-preview-area') {\n const newPos = {\n x: position.x + ev.delta.x,\n y: position.y + ev.delta.y,\n }\n\n setPosition(newPos)\n } else {\n // reset\n }\n }\n\n const setWidth = useCallback(\n (width) => {\n setSize({ type: 'width', value: width })\n },\n [setSize],\n )\n\n const setHeight = useCallback(\n (height) => {\n setSize({ type: 'height', value: height })\n },\n [setSize],\n )\n\n // explicitly set new width and height when as new breakpoints are selected\n // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly\n useEffect(() => {\n const foundBreakpoint = breakpoints?.find((bp) => bp.name === breakpoint)\n\n if (\n foundBreakpoint &&\n breakpoint !== 'responsive' &&\n breakpoint !== 'custom' &&\n typeof foundBreakpoint?.width === 'number' &&\n typeof foundBreakpoint?.height === 'number'\n ) {\n setSize({\n type: 'reset',\n value: {\n height: foundBreakpoint.height,\n width: foundBreakpoint.width,\n },\n })\n }\n }, [breakpoint, breakpoints])\n\n /**\n * Receive the `ready` message from the popup window\n * This indicates that the app is ready to receive `window.postMessage` events\n * This is also the only cross-origin way of detecting when a popup window has loaded\n * Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups\n */\n useEffect(() => {\n const handleMessage = (event: MessageEvent) => {\n if (\n url?.startsWith(event.origin) &&\n event.data &&\n typeof event.data === 'object' &&\n event.data.type === 'payload-live-preview'\n ) {\n if (event.data.ready) {\n setAppIsReady(true)\n }\n }\n }\n\n window.addEventListener('message', handleMessage)\n\n setListeningForMessages(true)\n\n return () => {\n window.removeEventListener('message', handleMessage)\n }\n }, [url, listeningForMessages])\n\n const handleWindowChange = useCallback(\n (type: 'iframe' | 'popup') => {\n setAppIsReady(false)\n setPreviewWindowType(type)\n if (type === 'popup') {\n openPopupWindow()\n }\n },\n [openPopupWindow],\n )\n\n // when the user closes the popup window, switch back to the iframe\n // the `usePopupWindow` reports the `isPopupOpen` state for us to use here\n useEffect(() => {\n const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe'\n\n if (newPreviewWindowType !== previewWindowType) {\n handleWindowChange('iframe')\n }\n }, [previewWindowType, isPopupOpen, handleWindowChange])\n\n useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false\n return\n }\n\n void setPreference<CollectionPreferences>(\n collectionSlug ? `collection-${collectionSlug}` : `global-${globalSlug}`,\n {\n editViewType: isLivePreviewing ? 'live-preview' : 'default',\n },\n true,\n )\n }, [isLivePreviewing, setPreference, collectionSlug, globalSlug])\n\n return (\n <LivePreviewContext\n value={{\n appIsReady,\n breakpoint,\n breakpoints,\n iframeRef,\n isLivePreviewEnabled,\n isLivePreviewing,\n isPopupOpen,\n listeningForMessages,\n loadedURL,\n measuredDeviceSize,\n openPopupWindow,\n popupRef,\n previewWindowType,\n setAppIsReady,\n setBreakpoint,\n setHeight,\n setIsLivePreviewing,\n setLoadedURL,\n setMeasuredDeviceSize,\n setPreviewWindowType: handleWindowChange,\n setSize,\n setToolbarPosition: setPosition,\n setURL: setLivePreviewURL,\n setWidth,\n setZoom,\n size,\n toolbarPosition: position,\n typeofLivePreviewURL,\n url,\n zoom,\n }}\n >\n <DndContext collisionDetection={customCollisionDetection} onDragEnd={handleDragEnd}>\n {children}\n </DndContext>\n </LivePreviewContext>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["DndContext","React","useCallback","useEffect","useMemo","useRef","useState","usePopupWindow","useDocumentInfo","usePreferences","formatAbsoluteURL","customCollisionDetection","LivePreviewContext","sizeReducer","LivePreviewProvider","breakpoints","incomingBreakpoints","children","isLivePreviewEnabled","isLivePreviewing","incomingIsLivePreviewing","typeofLivePreviewURL","url","urlFromProps","previewWindowType","setPreviewWindowType","setIsLivePreviewing","name","height","label","width","setURL","isPopupOpen","openPopupWindow","popupRef","eventType","appIsReady","setAppIsReady","listeningForMessages","setListeningForMessages","collectionSlug","globalSlug","isFirstRender","setPreference","iframeRef","loadedURL","setLoadedURL","zoom","setZoom","position","setPosition","x","y","size","setSize","useReducer","measuredDeviceSize","setMeasuredDeviceSize","breakpoint","setBreakpoint","setLivePreviewURL","_incomingURL","incomingURL","handleDragEnd","ev","over","id","newPos","delta","setWidth","type","value","setHeight","foundBreakpoint","find","bp","handleMessage","event","startsWith","origin","data","ready","window","addEventListener","removeEventListener","handleWindowChange","newPreviewWindowType","current","editViewType","_jsx","setToolbarPosition","toolbarPosition","collisionDetection","onDragEnd"],"sources":["../../../src/providers/LivePreview/index.tsx"],"sourcesContent":["'use client'\nimport type { CollectionPreferences, LivePreviewConfig, LivePreviewURLType } from 'payload'\n\nimport { DndContext } from '@dnd-kit/core'\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\n\nimport type { LivePreviewContextType } from './context.js'\n\nimport { usePopupWindow } from '../../hooks/usePopupWindow.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { formatAbsoluteURL } from '../../utilities/formatAbsoluteURL.js'\nimport { customCollisionDetection } from './collisionDetection.js'\nimport { LivePreviewContext } from './context.js'\nimport { sizeReducer } from './sizeReducer.js'\n\nexport type LivePreviewProviderProps = {\n appIsReady?: boolean\n breakpoints?: LivePreviewConfig['breakpoints']\n children: React.ReactNode\n deviceSize?: {\n height: number\n width: number\n }\n isLivePreviewEnabled?: boolean\n isLivePreviewing: boolean\n} & Pick<LivePreviewContextType, 'typeofLivePreviewURL' | 'url'>\n\nexport const LivePreviewProvider: React.FC<LivePreviewProviderProps> = ({\n breakpoints: incomingBreakpoints,\n children,\n isLivePreviewEnabled,\n isLivePreviewing: incomingIsLivePreviewing,\n typeofLivePreviewURL,\n url: urlFromProps,\n}) => {\n const [previewWindowType, setPreviewWindowType] = useState<'iframe' | 'popup'>('iframe')\n const [isLivePreviewing, setIsLivePreviewing] = useState(incomingIsLivePreviewing)\n\n const breakpoints: LivePreviewConfig['breakpoints'] = useMemo(\n () => [\n ...(incomingBreakpoints || []),\n {\n name: 'responsive',\n height: '100%',\n label: 'Responsive',\n width: '100%',\n },\n ],\n [incomingBreakpoints],\n )\n\n const [url, setURL] = useState<string>('')\n\n const { isPopupOpen, openPopupWindow, popupRef } = usePopupWindow({\n eventType: 'payload-live-preview',\n url,\n })\n\n const [appIsReady, setAppIsReady] = useState(false)\n const [listeningForMessages, setListeningForMessages] = useState(false)\n\n const { collectionSlug, globalSlug } = useDocumentInfo()\n\n const isFirstRender = useRef(true)\n\n const { setPreference } = usePreferences()\n\n const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n const [loadedURL, setLoadedURL] = useState<string>()\n\n const [zoom, setZoom] = useState(1)\n\n const [position, setPosition] = useState({ x: 0, y: 0 })\n\n const [size, setSize] = React.useReducer(sizeReducer, { height: 0, width: 0 })\n\n const [measuredDeviceSize, setMeasuredDeviceSize] = useState({\n height: 0,\n width: 0,\n })\n\n const [breakpoint, setBreakpoint] =\n React.useState<LivePreviewConfig['breakpoints'][0]['name']>('responsive')\n\n /**\n * A \"middleware\" callback fn that does some additional work before `setURL`.\n * This is what we provide through context, bc it:\n * - ensures the URL is absolute\n * - resets `appIsReady` to `false` while the new URL is loading\n */\n const setLivePreviewURL = useCallback<LivePreviewContextType['setURL']>(\n (_incomingURL) => {\n let incomingURL: LivePreviewURLType\n\n if (typeof _incomingURL === 'string') {\n incomingURL = formatAbsoluteURL(_incomingURL)\n }\n\n if (!incomingURL) {\n setIsLivePreviewing(false)\n }\n\n if (incomingURL !== url) {\n setAppIsReady(false)\n setURL(incomingURL)\n }\n },\n [url],\n )\n\n /**\n * `url` needs to be relative to the window, which cannot be done on initial render.\n */\n useEffect(() => {\n if (typeof urlFromProps === 'string') {\n setURL(formatAbsoluteURL(urlFromProps))\n }\n }, [urlFromProps])\n\n // The toolbar needs to freely drag and drop around the page\n const handleDragEnd = (ev) => {\n // only update position if the toolbar is completely within the preview area\n // otherwise reset it back to the previous position\n // TODO: reset to the nearest edge of the preview area\n if (ev.over && ev.over.id === 'live-preview-area') {\n const newPos = {\n x: position.x + ev.delta.x,\n y: position.y + ev.delta.y,\n }\n\n setPosition(newPos)\n } else {\n // reset\n }\n }\n\n const setWidth = useCallback(\n (width) => {\n setSize({ type: 'width', value: width })\n },\n [setSize],\n )\n\n const setHeight = useCallback(\n (height) => {\n setSize({ type: 'height', value: height })\n },\n [setSize],\n )\n\n // explicitly set new width and height when as new breakpoints are selected\n // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly\n useEffect(() => {\n const foundBreakpoint = breakpoints?.find((bp) => bp.name === breakpoint)\n\n if (\n foundBreakpoint &&\n breakpoint !== 'responsive' &&\n breakpoint !== 'custom' &&\n typeof foundBreakpoint?.width === 'number' &&\n typeof foundBreakpoint?.height === 'number'\n ) {\n setSize({\n type: 'reset',\n value: {\n height: foundBreakpoint.height,\n width: foundBreakpoint.width,\n },\n })\n }\n }, [breakpoint, breakpoints])\n\n /**\n * Receive the `ready` message from the popup window\n * This indicates that the app is ready to receive `window.postMessage` events\n * This is also the only cross-origin way of detecting when a popup window has loaded\n * Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups\n */\n useEffect(() => {\n const handleMessage = (event: MessageEvent) => {\n if (\n url?.startsWith(event.origin) &&\n event.data &&\n typeof event.data === 'object' &&\n event.data.type === 'payload-live-preview'\n ) {\n if (event.data.ready) {\n setAppIsReady(true)\n }\n }\n }\n\n window.addEventListener('message', handleMessage)\n\n setListeningForMessages(true)\n\n return () => {\n window.removeEventListener('message', handleMessage)\n }\n }, [url, listeningForMessages])\n\n const handleWindowChange = useCallback(\n (type: 'iframe' | 'popup') => {\n setAppIsReady(false)\n setPreviewWindowType(type)\n if (type === 'popup') {\n openPopupWindow()\n }\n },\n [openPopupWindow],\n )\n\n // when the user closes the popup window, switch back to the iframe\n // the `usePopupWindow` reports the `isPopupOpen` state for us to use here\n useEffect(() => {\n const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe'\n\n if (newPreviewWindowType !== previewWindowType) {\n handleWindowChange('iframe')\n }\n }, [previewWindowType, isPopupOpen, handleWindowChange])\n\n useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false\n return\n }\n\n void setPreference<CollectionPreferences>(\n collectionSlug ? `collection-${collectionSlug}` : `global-${globalSlug}`,\n {\n editViewType: isLivePreviewing ? 'live-preview' : 'default',\n },\n true,\n )\n }, [isLivePreviewing, setPreference, collectionSlug, globalSlug])\n\n return (\n <LivePreviewContext\n value={{\n appIsReady,\n breakpoint,\n breakpoints,\n iframeRef,\n isLivePreviewEnabled,\n isLivePreviewing,\n isPopupOpen,\n listeningForMessages,\n loadedURL,\n measuredDeviceSize,\n openPopupWindow,\n popupRef,\n previewWindowType,\n setAppIsReady,\n setBreakpoint,\n setHeight,\n setIsLivePreviewing,\n setLoadedURL,\n setMeasuredDeviceSize,\n setPreviewWindowType: handleWindowChange,\n setSize,\n setToolbarPosition: setPosition,\n setURL: setLivePreviewURL,\n setWidth,\n setZoom,\n size,\n toolbarPosition: position,\n typeofLivePreviewURL,\n url,\n zoom,\n }}\n >\n <DndContext collisionDetection={customCollisionDetection} onDragEnd={handleDragEnd}>\n {children}\n </DndContext>\n </LivePreviewContext>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|