{"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} style={{ zIndex: 5 }}>\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","style","padding","InputRenderer","label","name","visible"],"mappings":"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"}