@strapi/content-manager 0.0.0-next.a28002c793bc4de2a8b3c6c5b9c2336c5a6db7a9 → 0.0.0-next.aa9c4618783d5e736a3c470cb132b4b7ac807584

package/dist/admin/preview/components/InputPopover.mjs

@@ -0,0 +1,167 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { createContext, useNotification } from '@strapi/admin/strapi-admin';
+import { Box, Popover } from '@strapi/design-system';
+import { useIntl } from 'react-intl';
+import { InputRenderer as MemoizedInputRenderer } from '../../pages/EditView/components/InputRenderer.mjs';
+import { usePreviewContext } from '../pages/Preview.mjs';
+import { INTERNAL_EVENTS, PREVIEW_ERROR_MESSAGES } from '../utils/constants.mjs';
+import { parseFieldMetaData, getAttributeSchemaFromPath, PreviewFieldError } from '../utils/fieldUtils.mjs';
+
+const [InputPopoverProvider, useInputPopoverContext] = createContext('InputPopover');
+function useHasInputPopoverParent() {
+    const context = useInputPopoverContext('useHasInputPopoverParent', ()=>true, false);
+    // useContext will return undefined if the called is not wrapped in the provider
+    return context !== undefined;
+}
+/* -------------------------------------------------------------------------------------------------
+ * InputPopover
+ * -----------------------------------------------------------------------------------------------*/ const InputPopover = ({ documentResponse })=>{
+    const iframeRef = usePreviewContext('InputPopover', (state)=>state.iframeRef);
+    const popoverField = usePreviewContext('InputPopover', (state)=>state.popoverField);
+    const setPopoverField = usePreviewContext('InputPopover', (state)=>state.setPopoverField);
+    const document = usePreviewContext('InputPopover', (state)=>state.document);
+    const schema = usePreviewContext('InputPopover', (state)=>state.schema);
+    const components = usePreviewContext('InputPopover', (state)=>state.components);
+    const { toggleNotification } = useNotification();
+    const { formatMessage } = useIntl();
+    React.useEffect(()=>{
+        /**
+     * We receive window events sent from the user's preview via the injected script.
+     * We listen to the ones here that target a specific field.
+     */ const handleMessage = (event)=>{
+            // Only listen to events from the preview iframe
+            if (iframeRef.current) {
+                const previewOrigin = new URL(iframeRef.current?.src).origin;
+                if (event.origin !== previewOrigin) {
+                    return;
+                }
+            }
+            if (event.data?.type === INTERNAL_EVENTS.STRAPI_FIELD_FOCUS_INTENT) {
+                const fieldMetaData = parseFieldMetaData(event.data.payload.path);
+                if (!fieldMetaData) {
+                    const { type, message } = PREVIEW_ERROR_MESSAGES.INCOMPLETE_STRAPI_SOURCE;
+                    toggleNotification({
+                        type,
+                        message: formatMessage(message)
+                    });
+                    return;
+                }
+                /**
+         * Ignore (for now) content that comes from separate API requests than the one for the
+         * current document. This doesn't do anything about fields that may come from relations to
+         * the current document however.
+         */ if (fieldMetaData.documentId !== document.documentId) {
+                    const { type, message } = PREVIEW_ERROR_MESSAGES.DIFFERENT_DOCUMENT;
+                    toggleNotification({
+                        type,
+                        message: formatMessage(message)
+                    });
+                    return;
+                }
+                try {
+                    const attribute = getAttributeSchemaFromPath({
+                        path: fieldMetaData.path,
+                        components,
+                        schema,
+                        document
+                    });
+                    // We're able to handle the field, set it in context so the popover can pick it up
+                    setPopoverField({
+                        ...fieldMetaData,
+                        position: event.data.payload.position,
+                        attribute
+                    });
+                } catch (error) {
+                    if (error instanceof PreviewFieldError) {
+                        const { type, message } = PREVIEW_ERROR_MESSAGES[error.messageKey];
+                        toggleNotification({
+                            type,
+                            message: formatMessage(message)
+                        });
+                    } else if (error instanceof Error) {
+                        toggleNotification({
+                            type: 'danger',
+                            message: error.message
+                        });
+                    }
+                }
+            }
+            if (event.data?.type === INTERNAL_EVENTS.STRAPI_FIELD_SINGLE_CLICK_HINT) {
+                toggleNotification({
+                    type: 'info',
+                    message: formatMessage({
+                        id: 'content-manager.preview.info.single-click-hint',
+                        defaultMessage: 'Double click to edit'
+                    })
+                });
+            }
+        };
+        window.addEventListener('message', handleMessage);
+        return ()=>{
+            window.removeEventListener('message', handleMessage);
+        };
+    }, [
+        components,
+        document,
+        iframeRef,
+        schema,
+        setPopoverField,
+        toggleNotification,
+        formatMessage
+    ]);
+    if (!popoverField || !iframeRef.current) {
+        return null;
+    }
+    const iframeRect = iframeRef.current.getBoundingClientRect();
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx(Box, {
+                position: 'fixed',
+                top: iframeRect.top + 'px',
+                left: iframeRect.left + 'px',
+                width: iframeRect.width + 'px',
+                height: iframeRect.height + 'px',
+                zIndex: 4,
+                onClick: ()=>iframeRef.current?.focus()
+            }),
+            /*#__PURE__*/ jsx(InputPopoverProvider, {
+                children: /*#__PURE__*/ jsxs(Popover.Root, {
+                    open: true,
+                    onOpenChange: (open)=>!open && setPopoverField(null),
+                    children: [
+                        /*#__PURE__*/ jsx(Popover.Trigger, {
+                            children: /*#__PURE__*/ jsx(Box, {
+                                position: "fixed",
+                                width: popoverField.position.width + 'px',
+                                height: popoverField.position.height + 'px',
+                                top: 0,
+                                left: 0,
+                                transform: `translate(${iframeRect.left + popoverField.position.left}px, ${iframeRect.top + popoverField.position.top}px)`
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(Popover.Content, {
+                            sideOffset: 4,
+                            children: /*#__PURE__*/ jsx(Box, {
+                                padding: 4,
+                                width: "400px",
+                                children: /*#__PURE__*/ jsx(MemoizedInputRenderer, {
+                                    document: documentResponse,
+                                    attribute: popoverField.attribute,
+                                    // TODO: retrieve the proper label from the layout
+                                    label: popoverField.path,
+                                    name: popoverField.path,
+                                    type: popoverField.attribute.type,
+                                    visible: true
+                                })
+                            })
+                        })
+                    ]
+                })
+            })
+        ]
+    });
+};
+
+export { InputPopover, useHasInputPopoverParent };
+//# sourceMappingURL=InputPopover.mjs.map

package/dist/admin/preview/components/InputPopover.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputPopover.mjs","sources":["../../../../admin/src/preview/components/InputPopover.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { createContext, useNotification } from '@strapi/admin/strapi-admin';\nimport { Box, Popover } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { type UseDocument } from '../../hooks/useDocument';\nimport { InputRenderer } from '../../pages/EditView/components/InputRenderer';\nimport { usePreviewContext } from '../pages/Preview';\nimport { INTERNAL_EVENTS, PREVIEW_ERROR_MESSAGES } from '../utils/constants';\nimport {\n  parseFieldMetaData,\n  getAttributeSchemaFromPath,\n  PreviewFieldError,\n} from '../utils/fieldUtils';\n\n/* -------------------------------------------------------------------------------------------------\n * Context utils\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * No need for actual data in the context. It's just to let children check if they're rendered\n * inside of a preview InputPopover without relying on prop drilling.\n */\ninterface InputPopoverContextValue {}\n\nconst [InputPopoverProvider, useInputPopoverContext] =\n  createContext<InputPopoverContextValue>('InputPopover');\n\nfunction useHasInputPopoverParent() {\n  const context = useInputPopoverContext('useHasInputPopoverParent', () => true, false);\n\n  // useContext will return undefined if the called is not wrapped in the provider\n  return context !== undefined;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * InputPopover\n * -----------------------------------------------------------------------------------------------*/\n\nconst InputPopover = ({ documentResponse }: { documentResponse: ReturnType<UseDocument> }) => {\n  const iframeRef = usePreviewContext('InputPopover', (state) => state.iframeRef);\n  const popoverField = usePreviewContext('InputPopover', (state) => state.popoverField);\n  const setPopoverField = usePreviewContext('InputPopover', (state) => state.setPopoverField);\n  const document = usePreviewContext('InputPopover', (state) => state.document);\n  const schema = usePreviewContext('InputPopover', (state) => state.schema);\n  const components = usePreviewContext('InputPopover', (state) => state.components);\n\n  const { toggleNotification } = useNotification();\n  const { formatMessage } = useIntl();\n\n  React.useEffect(() => {\n    /**\n     * We receive window events sent from the user's preview via the injected script.\n     * We listen to the ones here that target a specific field.\n     */\n    const handleMessage = (event: MessageEvent) => {\n      // Only listen to events from the preview iframe\n      if (iframeRef.current) {\n        const previewOrigin = new URL(iframeRef.current?.src).origin;\n        if (event.origin !== previewOrigin) {\n          return;\n        }\n      }\n\n      if (event.data?.type === INTERNAL_EVENTS.STRAPI_FIELD_FOCUS_INTENT) {\n        const fieldMetaData = parseFieldMetaData(event.data.payload.path);\n\n        if (!fieldMetaData) {\n          const { type, message } = PREVIEW_ERROR_MESSAGES.INCOMPLETE_STRAPI_SOURCE;\n          toggleNotification({ type, message: formatMessage(message) });\n          return;\n        }\n\n        /**\n         * Ignore (for now) content that comes from separate API requests than the one for the\n         * current document. This doesn't do anything about fields that may come from relations to\n         * the current document however.\n         */\n        if (fieldMetaData.documentId !== document.documentId) {\n          const { type, message } = PREVIEW_ERROR_MESSAGES.DIFFERENT_DOCUMENT;\n          toggleNotification({ type, message: formatMessage(message) });\n          return;\n        }\n\n        try {\n          const attribute = getAttributeSchemaFromPath({\n            path: fieldMetaData.path,\n            components,\n            schema,\n            document,\n          });\n\n          // We're able to handle the field, set it in context so the popover can pick it up\n          setPopoverField({ ...fieldMetaData, position: event.data.payload.position, attribute });\n        } catch (error) {\n          if (error instanceof PreviewFieldError) {\n            const { type, message } = PREVIEW_ERROR_MESSAGES[error.messageKey];\n            toggleNotification({ type, message: formatMessage(message) });\n          } else if (error instanceof Error) {\n            toggleNotification({ type: 'danger', message: error.message });\n          }\n        }\n      }\n\n      if (event.data?.type === INTERNAL_EVENTS.STRAPI_FIELD_SINGLE_CLICK_HINT) {\n        toggleNotification({\n          type: 'info',\n          message: formatMessage({\n            id: 'content-manager.preview.info.single-click-hint',\n            defaultMessage: 'Double click to edit',\n          }),\n        });\n      }\n    };\n\n    window.addEventListener('message', handleMessage);\n\n    return () => {\n      window.removeEventListener('message', handleMessage);\n    };\n  }, [components, document, iframeRef, schema, setPopoverField, toggleNotification, formatMessage]);\n  if (!popoverField || !iframeRef.current) {\n    return null;\n  }\n\n  const iframeRect = iframeRef.current.getBoundingClientRect();\n\n  return (\n    <>\n      {/**\n       * Overlay an empty div on top of the iframe while the popover is open so it can\n       * intercept clicks. Without it, we wouldn't be able to close the popover by clicking outside,\n       * because the click would be detected by the iframe window, not by the admin.\n       **/}\n      <Box\n        position={'fixed'}\n        top={iframeRect.top + 'px'}\n        left={iframeRect.left + 'px'}\n        width={iframeRect.width + 'px'}\n        height={iframeRect.height + 'px'}\n        zIndex={4}\n        onClick={() => iframeRef.current?.focus()}\n      />\n      <InputPopoverProvider>\n        <Popover.Root open={true} onOpenChange={(open) => !open && setPopoverField(null)}>\n          <Popover.Trigger>\n            <Box\n              position=\"fixed\"\n              width={popoverField.position.width + 'px'}\n              height={popoverField.position.height + 'px'}\n              top={0}\n              left={0}\n              transform={`translate(${iframeRect.left + popoverField.position.left}px, ${iframeRect.top + popoverField.position.top}px)`}\n            />\n          </Popover.Trigger>\n          <Popover.Content sideOffset={4}>\n            <Box padding={4} width=\"400px\">\n              {/* @ts-expect-error the types of `attribute` clash for some reason */}\n              <InputRenderer\n                document={documentResponse}\n                attribute={popoverField.attribute}\n                // TODO: retrieve the proper label from the layout\n                label={popoverField.path}\n                name={popoverField.path}\n                type={popoverField.attribute.type}\n                visible={true}\n              />\n            </Box>\n          </Popover.Content>\n        </Popover.Root>\n      </InputPopoverProvider>\n    </>\n  );\n};\n\nexport { InputPopover, useHasInputPopoverParent };\n"],"names":["InputPopoverProvider","useInputPopoverContext","createContext","useHasInputPopoverParent","context","undefined","InputPopover","documentResponse","iframeRef","usePreviewContext","state","popoverField","setPopoverField","document","schema","components","toggleNotification","useNotification","formatMessage","useIntl","React","useEffect","handleMessage","event","current","previewOrigin","URL","src","origin","data","type","INTERNAL_EVENTS","STRAPI_FIELD_FOCUS_INTENT","fieldMetaData","parseFieldMetaData","payload","path","message","PREVIEW_ERROR_MESSAGES","INCOMPLETE_STRAPI_SOURCE","documentId","DIFFERENT_DOCUMENT","attribute","getAttributeSchemaFromPath","position","error","PreviewFieldError","messageKey","Error","STRAPI_FIELD_SINGLE_CLICK_HINT","id","defaultMessage","window","addEventListener","removeEventListener","iframeRect","getBoundingClientRect","_jsxs","_Fragment","_jsx","Box","top","left","width","height","zIndex","onClick","focus","Popover","Root","open","onOpenChange","Trigger","transform","Content","sideOffset","padding","InputRenderer","label","name","visible"],"mappings":"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"}

package/dist/admin/preview/components/PreviewHeader.js

@@ -0,0 +1,260 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+require('react');
+var strapiAdmin = require('@strapi/admin/strapi-admin');
+var designSystem = require('@strapi/design-system');
+var Icons = require('@strapi/icons');
+var qs = require('qs');
+var reactIntl = require('react-intl');
+var reactRouterDom = require('react-router-dom');
+var styledComponents = require('styled-components');
+var InjectionZone = require('../../components/InjectionZone.js');
+var DocumentActions = require('../../pages/EditView/components/DocumentActions.js');
+var DocumentStatus = require('../../pages/EditView/components/DocumentStatus.js');
+var EditViewPage = require('../../pages/EditView/EditViewPage.js');
+var Preview = require('../pages/Preview.js');
+
+/* -------------------------------------------------------------------------------------------------
+ * ClosePreviewButton
+ * -----------------------------------------------------------------------------------------------*/ const ClosePreviewButton = ()=>{
+    const [{ query }] = strapiAdmin.useQueryParams();
+    const { formatMessage } = reactIntl.useIntl();
+    const canGoBack = strapiAdmin.useHistory('BackButton', (state)=>state.canGoBack);
+    const goBack = strapiAdmin.useHistory('BackButton', (state)=>state.goBack);
+    const history = strapiAdmin.useHistory('BackButton', (state)=>state.history);
+    const locationIndex = strapiAdmin.useHistory('BackButton', (state)=>state.currentLocationIndex);
+    /**
+   * Get the link destination from the history.
+   * Rely on a fallback (the parent edit view page) if there's no page to go back .
+   */ const historyTo = canGoBack ? history.at(locationIndex - 2) : undefined;
+    const fallback = {
+        pathname: '..',
+        search: qs.stringify(query, {
+            encode: false
+        })
+    };
+    const toWithFallback = historyTo ?? fallback;
+    const handleClick = (e)=>{
+        if (canGoBack) {
+            // Prevent normal link behavior, go back in the history stack instead
+            e.preventDefault();
+            goBack();
+            return;
+        }
+    // Otherwise rely on native link behavior to go back to the edit view. We don't use navigate()
+    // here in order to get the relative="path" functionality from the Link component.
+    };
+    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+        variant: "ghost",
+        tag: reactRouterDom.Link,
+        relative: "path",
+        to: toWithFallback,
+        onClick: handleClick,
+        label: formatMessage({
+            id: 'content-manager.preview.header.close',
+            defaultMessage: 'Close preview'
+        }),
+        children: /*#__PURE__*/ jsxRuntime.jsx(Icons.Cross, {})
+    });
+};
+/* -------------------------------------------------------------------------------------------------
+ * Status
+ * -----------------------------------------------------------------------------------------------*/ const Status = ()=>{
+    // Get status
+    const document = Preview.usePreviewContext('PreviewHeader', (state)=>state.document);
+    const schema = Preview.usePreviewContext('PreviewHeader', (state)=>state.schema);
+    const meta = Preview.usePreviewContext('PreviewHeader', (state)=>state.meta);
+    const hasDraftAndPublished = schema?.options?.draftAndPublish ?? false;
+    if (!hasDraftAndPublished) {
+        return null;
+    }
+    const status = EditViewPage.getDocumentStatus(document, meta);
+    return /*#__PURE__*/ jsxRuntime.jsx(DocumentStatus.DocumentStatus, {
+        status: status,
+        size: "XS"
+    });
+};
+const PreviewTabs = ()=>{
+    const { formatMessage } = reactIntl.useIntl();
+    // URL query params
+    const [{ query }, setQuery] = strapiAdmin.useQueryParams();
+    // Get status
+    const document = Preview.usePreviewContext('PreviewHeader', (state)=>state.document);
+    const schema = Preview.usePreviewContext('PreviewHeader', (state)=>state.schema);
+    const meta = Preview.usePreviewContext('PreviewHeader', (state)=>state.meta);
+    const hasDraftAndPublish = schema?.options?.draftAndPublish ?? false;
+    const documentStatus = EditViewPage.getDocumentStatus(document, meta);
+    const handleTabChange = (status)=>{
+        if (status === 'published' || status === 'draft') {
+            setQuery({
+                status
+            }, 'push', true);
+        }
+    };
+    if (!hasDraftAndPublish) {
+        return null;
+    }
+    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Tabs.Root, {
+        variant: "simple",
+        value: query.status || 'draft',
+        onValueChange: handleTabChange,
+        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Tabs.List, {
+            "aria-label": formatMessage({
+                id: 'preview.tabs.label',
+                defaultMessage: 'Document status'
+            }),
+            children: [
+                /*#__PURE__*/ jsxRuntime.jsx(StatusTab, {
+                    value: "draft",
+                    children: formatMessage({
+                        id: 'content-manager.containers.List.draft',
+                        defaultMessage: 'draft'
+                    })
+                }),
+                /*#__PURE__*/ jsxRuntime.jsx(StatusTab, {
+                    value: "published",
+                    disabled: documentStatus === 'draft',
+                    children: formatMessage({
+                        id: 'content-manager.containers.List.published',
+                        defaultMessage: 'published'
+                    })
+                })
+            ]
+        })
+    });
+};
+/* -------------------------------------------------------------------------------------------------
+ * PreviewHeader
+ * -----------------------------------------------------------------------------------------------*/ const PreviewHeader = ()=>{
+    const title = Preview.usePreviewContext('PreviewHeader', (state)=>state.title);
+    const document = Preview.usePreviewContext('PreviewHeader', (state)=>state.document);
+    const schema = Preview.usePreviewContext('PreviewHeader', (state)=>state.schema);
+    const meta = Preview.usePreviewContext('PreviewHeader', (state)=>state.meta);
+    const plugins = strapiAdmin.useStrapiApp('PreviewHeader', (state)=>state.plugins);
+    const [{ query }] = strapiAdmin.useQueryParams();
+    const { formatMessage } = reactIntl.useIntl();
+    const { toggleNotification } = strapiAdmin.useNotification();
+    const { copy } = strapiAdmin.useClipboard();
+    const handleCopyLink = ()=>{
+        copy(window.location.href);
+        toggleNotification({
+            message: formatMessage({
+                id: 'content-manager.preview.copy.success',
+                defaultMessage: 'Copied preview link'
+            }),
+            type: 'success'
+        });
+    };
+    const hasDraftAndPublish = schema.options?.draftAndPublish ?? false;
+    const documentActionProps = {
+        activeTab: query.status ?? null,
+        collectionType: schema.kind === 'collectionType' ? 'collection-types' : 'single-types',
+        model: schema.uid,
+        documentId: schema.kind === 'collectionType' ? document.documentId : undefined,
+        document,
+        meta
+    };
+    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+        height: "48px",
+        gap: 4,
+        background: "neutral0",
+        borderColor: "neutral150",
+        tag: "header",
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsxs(TitleContainer, {
+                height: "100%",
+                paddingLeft: 2,
+                paddingRight: 4,
+                children: [
+                    /*#__PURE__*/ jsxRuntime.jsx(ClosePreviewButton, {}),
+                    /*#__PURE__*/ jsxRuntime.jsx(PreviewTitle, {
+                        tag: "h1",
+                        title: title,
+                        maxWidth: "200px",
+                        fontSize: 2,
+                        paddingLeft: 2,
+                        paddingRight: 3,
+                        fontWeight: 600,
+                        children: title
+                    }),
+                    /*#__PURE__*/ jsxRuntime.jsx(Status, {})
+                ]
+            }),
+            /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                flex: 1,
+                paddingRight: 2,
+                gap: 2,
+                justifyContent: hasDraftAndPublish ? 'space-between' : 'flex-end',
+                children: [
+                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+                        flex: "1 1 70%",
+                        children: /*#__PURE__*/ jsxRuntime.jsx(PreviewTabs, {})
+                    }),
+                    /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                        gap: 2,
+                        children: [
+                            /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                                type: "button",
+                                label: formatMessage({
+                                    id: 'preview.copy.label',
+                                    defaultMessage: 'Copy preview link'
+                                }),
+                                onClick: handleCopyLink,
+                                children: /*#__PURE__*/ jsxRuntime.jsx(Icons.Link, {})
+                            }),
+                            /*#__PURE__*/ jsxRuntime.jsx(InjectionZone.InjectionZone, {
+                                area: "preview.actions"
+                            }),
+                            /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.DescriptionComponentRenderer, {
+                                props: documentActionProps,
+                                descriptions: plugins['content-manager'].apis.getDocumentActions('preview'),
+                                children: (actions)=>{
+                                    const filteredActions = actions.filter((action)=>[
+                                            action.position
+                                        ].flat().includes('preview'));
+                                    const [primaryAction, secondaryAction] = filteredActions;
+                                    if (!primaryAction && !secondaryAction) return null;
+                                    // Both actions are available when draft and publish enabled
+                                    if (primaryAction && secondaryAction) {
+                                        return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+                                            children: [
+                                                /*#__PURE__*/ jsxRuntime.jsx(DocumentActions.DocumentActionButton, {
+                                                    ...secondaryAction,
+                                                    variant: secondaryAction.variant || 'secondary'
+                                                }),
+                                                /*#__PURE__*/ jsxRuntime.jsx(DocumentActions.DocumentActionButton, {
+                                                    ...primaryAction,
+                                                    variant: primaryAction.variant || 'default'
+                                                })
+                                            ]
+                                        });
+                                    }
+                                    // Otherwise we just have the save action
+                                    return /*#__PURE__*/ jsxRuntime.jsx(DocumentActions.DocumentActionButton, {
+                                        ...primaryAction,
+                                        variant: primaryAction.variant || 'secondary'
+                                    });
+                                }
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+};
+const PreviewTitle = styledComponents.styled(designSystem.Typography)`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`;
+const StatusTab = styledComponents.styled(designSystem.Tabs.Trigger)`
+  text-transform: uppercase;
+`;
+const TitleContainer = styledComponents.styled(designSystem.Flex)`
+  border-right: 1px solid ${({ theme })=>theme.colors.neutral150};
+`;
+
+exports.PreviewHeader = PreviewHeader;
+//# sourceMappingURL=PreviewHeader.js.map

package/dist/admin/preview/components/PreviewHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreviewHeader.js","sources":["../../../../admin/src/preview/components/PreviewHeader.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  DescriptionComponentRenderer,\n  useClipboard,\n  useHistory,\n  useNotification,\n  useQueryParams,\n  useStrapiApp,\n} from '@strapi/admin/strapi-admin';\nimport { IconButton, Tabs, Typography, Flex } from '@strapi/design-system';\nimport { Cross, Link as LinkIcon } from '@strapi/icons';\nimport { stringify } from 'qs';\nimport { useIntl } from 'react-intl';\nimport { Link, type To } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { InjectionZone } from '../../components/InjectionZone';\nimport { DocumentActionButton } from '../../pages/EditView/components/DocumentActions';\nimport { DocumentStatus } from '../../pages/EditView/components/DocumentStatus';\nimport { getDocumentStatus } from '../../pages/EditView/EditViewPage';\nimport { usePreviewContext } from '../pages/Preview';\n\nimport type { ContentManagerPlugin, DocumentActionProps } from '../../content-manager';\n\n/* -------------------------------------------------------------------------------------------------\n * ClosePreviewButton\n * -----------------------------------------------------------------------------------------------*/\n\nconst ClosePreviewButton = () => {\n  const [{ query }] = useQueryParams<{\n    plugins?: Record<string, unknown>;\n  }>();\n  const { formatMessage } = useIntl();\n\n  const canGoBack = useHistory('BackButton', (state) => state.canGoBack);\n  const goBack = useHistory('BackButton', (state) => state.goBack);\n  const history = useHistory('BackButton', (state) => state.history);\n  const locationIndex = useHistory('BackButton', (state) => state.currentLocationIndex);\n\n  /**\n   * Get the link destination from the history.\n   * Rely on a fallback (the parent edit view page) if there's no page to go back .\n   */\n  const historyTo = canGoBack ? history.at(locationIndex - 2) : undefined;\n  const fallback = {\n    pathname: '..',\n    search: stringify(query, { encode: false }),\n  } satisfies To;\n  const toWithFallback = historyTo ?? fallback;\n\n  const handleClick = (e: React.MouseEvent) => {\n    if (canGoBack) {\n      // Prevent normal link behavior, go back in the history stack instead\n      e.preventDefault();\n      goBack();\n      return;\n    }\n\n    // Otherwise rely on native link behavior to go back to the edit view. We don't use navigate()\n    // here in order to get the relative=\"path\" functionality from the Link component.\n  };\n\n  return (\n    <IconButton\n      variant=\"ghost\"\n      tag={Link}\n      relative=\"path\"\n      to={toWithFallback}\n      onClick={handleClick}\n      label={formatMessage({\n        id: 'content-manager.preview.header.close',\n        defaultMessage: 'Close preview',\n      })}\n    >\n      <Cross />\n    </IconButton>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Status\n * -----------------------------------------------------------------------------------------------*/\n\nconst Status = () => {\n  // Get status\n  const document = usePreviewContext('PreviewHeader', (state) => state.document);\n  const schema = usePreviewContext('PreviewHeader', (state) => state.schema);\n  const meta = usePreviewContext('PreviewHeader', (state) => state.meta);\n  const hasDraftAndPublished = schema?.options?.draftAndPublish ?? false;\n\n  if (!hasDraftAndPublished) {\n    return null;\n  }\n\n  const status = getDocumentStatus(document, meta);\n\n  return <DocumentStatus status={status} size=\"XS\" />;\n};\n\nconst PreviewTabs = () => {\n  const { formatMessage } = useIntl();\n\n  // URL query params\n  const [{ query }, setQuery] = useQueryParams<{ status: 'draft' | 'published' }>();\n\n  // Get status\n  const document = usePreviewContext('PreviewHeader', (state) => state.document);\n  const schema = usePreviewContext('PreviewHeader', (state) => state.schema);\n  const meta = usePreviewContext('PreviewHeader', (state) => state.meta);\n  const hasDraftAndPublish = schema?.options?.draftAndPublish ?? false;\n  const documentStatus = getDocumentStatus(document, meta);\n\n  const handleTabChange = (status: string) => {\n    if (status === 'published' || status === 'draft') {\n      setQuery({ status }, 'push', true);\n    }\n  };\n\n  if (!hasDraftAndPublish) {\n    return null;\n  }\n\n  return (\n    <Tabs.Root variant=\"simple\" value={query.status || 'draft'} onValueChange={handleTabChange}>\n      <Tabs.List\n        aria-label={formatMessage({\n          id: 'preview.tabs.label',\n          defaultMessage: 'Document status',\n        })}\n      >\n        <StatusTab value=\"draft\">\n          {formatMessage({\n            id: 'content-manager.containers.List.draft',\n            defaultMessage: 'draft',\n          })}\n        </StatusTab>\n        <StatusTab value=\"published\" disabled={documentStatus === 'draft'}>\n          {formatMessage({\n            id: 'content-manager.containers.List.published',\n            defaultMessage: 'published',\n          })}\n        </StatusTab>\n      </Tabs.List>\n    </Tabs.Root>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * PreviewHeader\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewHeader = () => {\n  const title = usePreviewContext('PreviewHeader', (state) => state.title);\n  const document = usePreviewContext('PreviewHeader', (state) => state.document);\n  const schema = usePreviewContext('PreviewHeader', (state) => state.schema);\n  const meta = usePreviewContext('PreviewHeader', (state) => state.meta);\n  const plugins = useStrapiApp('PreviewHeader', (state) => state.plugins);\n\n  const [{ query }] = useQueryParams<{\n    status?: 'draft' | 'published';\n  }>();\n  const { formatMessage } = useIntl();\n  const { toggleNotification } = useNotification();\n  const { copy } = useClipboard();\n\n  const handleCopyLink = () => {\n    copy(window.location.href);\n    toggleNotification({\n      message: formatMessage({\n        id: 'content-manager.preview.copy.success',\n        defaultMessage: 'Copied preview link',\n      }),\n      type: 'success',\n    });\n  };\n\n  const hasDraftAndPublish = schema.options?.draftAndPublish ?? false;\n  const documentActionProps = {\n    activeTab: query.status ?? null,\n    collectionType: schema.kind === 'collectionType' ? 'collection-types' : 'single-types',\n    model: schema.uid,\n    documentId: schema.kind === 'collectionType' ? document.documentId : undefined,\n    document,\n    meta,\n  } satisfies DocumentActionProps;\n\n  return (\n    <Flex height=\"48px\" gap={4} background=\"neutral0\" borderColor=\"neutral150\" tag=\"header\">\n      {/* Title and status */}\n      <TitleContainer height=\"100%\" paddingLeft={2} paddingRight={4}>\n        <ClosePreviewButton />\n        <PreviewTitle\n          tag=\"h1\"\n          title={title}\n          maxWidth=\"200px\"\n          fontSize={2}\n          paddingLeft={2}\n          paddingRight={3}\n          fontWeight={600}\n        >\n          {title}\n        </PreviewTitle>\n        <Status />\n      </TitleContainer>\n\n      {/* Tabs and actions */}\n      <Flex\n        flex={1}\n        paddingRight={2}\n        gap={2}\n        justifyContent={hasDraftAndPublish ? 'space-between' : 'flex-end'}\n      >\n        <Flex flex=\"1 1 70%\">\n          <PreviewTabs />\n        </Flex>\n        <Flex gap={2}>\n          <IconButton\n            type=\"button\"\n            label={formatMessage({\n              id: 'preview.copy.label',\n              defaultMessage: 'Copy preview link',\n            })}\n            onClick={handleCopyLink}\n          >\n            <LinkIcon />\n          </IconButton>\n          <InjectionZone area=\"preview.actions\" />\n          <DescriptionComponentRenderer\n            props={documentActionProps}\n            descriptions={(\n              plugins['content-manager'].apis as ContentManagerPlugin['config']['apis']\n            ).getDocumentActions('preview')}\n          >\n            {(actions) => {\n              const filteredActions = actions.filter((action) =>\n                [action.position].flat().includes('preview')\n              );\n              const [primaryAction, secondaryAction] = filteredActions;\n\n              if (!primaryAction && !secondaryAction) return null;\n\n              // Both actions are available when draft and publish enabled\n              if (primaryAction && secondaryAction) {\n                return (\n                  <>\n                    {/* Save */}\n                    <DocumentActionButton\n                      {...secondaryAction}\n                      variant={secondaryAction.variant || 'secondary'}\n                    />\n                    {/* Publish */}\n                    <DocumentActionButton\n                      {...primaryAction}\n                      variant={primaryAction.variant || 'default'}\n                    />\n                  </>\n                );\n              }\n\n              // Otherwise we just have the save action\n              return (\n                <DocumentActionButton\n                  {...primaryAction}\n                  variant={primaryAction.variant || 'secondary'}\n                />\n              );\n            }}\n          </DescriptionComponentRenderer>\n        </Flex>\n      </Flex>\n    </Flex>\n  );\n};\n\nconst PreviewTitle = styled(Typography)`\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n`;\n\nconst StatusTab = styled(Tabs.Trigger)`\n  text-transform: uppercase;\n`;\n\nconst TitleContainer = styled(Flex)`\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nexport { PreviewHeader };\n"],"names":["ClosePreviewButton","query","useQueryParams","formatMessage","useIntl","canGoBack","useHistory","state","goBack","history","locationIndex","currentLocationIndex","historyTo","at","undefined","fallback","pathname","search","stringify","encode","toWithFallback","handleClick","e","preventDefault","_jsx","IconButton","variant","tag","Link","relative","to","onClick","label","id","defaultMessage","Cross","Status","document","usePreviewContext","schema","meta","hasDraftAndPublished","options","draftAndPublish","status","getDocumentStatus","DocumentStatus","size","PreviewTabs","setQuery","hasDraftAndPublish","documentStatus","handleTabChange","Tabs","Root","value","onValueChange","_jsxs","List","aria-label","StatusTab","disabled","PreviewHeader","title","plugins","useStrapiApp","toggleNotification","useNotification","copy","useClipboard","handleCopyLink","window","location","href","message","type","documentActionProps","activeTab","collectionType","kind","model","uid","documentId","Flex","height","gap","background","borderColor","TitleContainer","paddingLeft","paddingRight","PreviewTitle","maxWidth","fontSize","fontWeight","flex","justifyContent","LinkIcon","InjectionZone","area","DescriptionComponentRenderer","props","descriptions","apis","getDocumentActions","actions","filteredActions","filter","action","position","flat","includes","primaryAction","secondaryAction","_Fragment","DocumentActionButton","styled","Typography","Trigger","theme","colors","neutral150"],"mappings":"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"}