{"version":3,"file":"Popover.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Popover/Popover.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import styled, { createGlobalStyle, css } from 'styled-components';\nimport { createContext, useLayoutEffect, useMemo } from 'react';\n\nimport { defaultThemeProp, Popover, useElement } from '@pega/cosmos-react-core';\nimport type { PopoverProps } from '@pega/cosmos-react-core';\n\nexport interface PlaceAndContainMockProps extends Pick<PopoverProps, 'arrow'> {\n  primaryPlacement: 'bottom' | 'top' | 'left' | 'right' | 'none';\n  secondaryPlacement: 'start' | 'end' | 'none';\n  contentSize: number;\n}\n\nconst PopoverMockContext = createContext<PlaceAndContainMockProps>({\n  arrow: false,\n  primaryPlacement: 'bottom',\n  secondaryPlacement: 'none',\n  contentSize: 1\n});\n\nconst Target = styled.div``;\n\nconst PopoverMockHeader = styled.div``;\n\nconst PopoverMockContent = styled.div(() => {\n  return css`\n    overflow: auto;\n  `;\n});\n\nconst PopoverMockFooter = styled.div``;\n\nconst MockContentBlock = styled.div(({ theme }) => {\n  return css`\n    min-width: ${theme.base['content-width'].md};\n    padding-block: ${theme.base.spacing};\n    border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n\n    &:first-child {\n      padding-block-start: 0;\n    }\n\n    &:last-child {\n      border: none;\n      padding-block-end: 0;\n    }\n  `;\n});\n\nMockContentBlock.defaultProps = defaultThemeProp;\n\nconst PopoverMock = styled(Popover)(({ theme }) => {\n  return css`\n    display: flex;\n    flex-direction: column;\n\n    ${PopoverMockHeader},\n    ${PopoverMockContent},\n    ${PopoverMockFooter} {\n      padding: calc(2 * ${theme.base.spacing});\n    }\n  `;\n});\n\nPopoverMock.defaultProps = defaultThemeProp;\n\nconst GlobalStyle = createGlobalStyle(({ theme }) => {\n  return css`\n    :root {\n      &::before,\n      &::after {\n        position: fixed;\n        content: '';\n        background-color: purple;\n        display: block;\n      }\n\n      &::before {\n        left: 0;\n        right: 0;\n        top: calc(50% - 0.0625rem);\n        height: 0.125rem;\n      }\n\n      &::after {\n        top: 0;\n        bottom: 0;\n        left: calc(50% - 0.0625rem);\n        width: 0.125rem;\n      }\n    }\n\n    body {\n      width: calc(200% - 2rem);\n      height: calc(200% - 2rem);\n    }\n\n    ${Target} {\n      position: absolute;\n      width: 2rem;\n      height: 2rem;\n      inset: 100% auto auto 100%;\n      transform: translate(-2rem, -2rem);\n      background-color: ${theme.base.palette['foreground-color']};\n    }\n  `;\n});\n\nexport const PlaceAndContainMock = ({\n  arrow,\n  primaryPlacement,\n  secondaryPlacement,\n  contentSize\n}: PlaceAndContainMockProps) => {\n  const [target, setTarget] = useElement<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    const vw = document.documentElement.clientWidth;\n    const vh = document.documentElement.clientHeight;\n\n    window.scrollTo(vw / 2 - 16, vh / 2 - 16);\n  }, []);\n\n  const mockContent = Array.from({ length: contentSize }, (_, i) => {\n    return <MockContentBlock key={i}>Content item {i + 1}</MockContentBlock>;\n  });\n\n  const ctxValue = useMemo(() => {\n    return { arrow, primaryPlacement, secondaryPlacement, contentSize };\n  }, [arrow, primaryPlacement, secondaryPlacement, contentSize]);\n\n  return (\n    <>\n      <GlobalStyle />\n      <PopoverMockContext.Provider value={ctxValue}>\n        <Target ref={setTarget} />\n        <PopoverMock\n          arrow={arrow}\n          target={target}\n          placement={`${primaryPlacement}${\n            secondaryPlacement && secondaryPlacement !== 'none' ? `-${secondaryPlacement}` : ''\n          }`}\n        >\n          <PopoverMockHeader>Header</PopoverMockHeader>\n          <PopoverMockContent>{mockContent}</PopoverMockContent>\n          <PopoverMockFooter>Footer</PopoverMockFooter>\n        </PopoverMock>\n      </PopoverMockContext.Provider>\n    </>\n  );\n};\n"]}