chore: show Super demo modal if user doesn't have subscription when switching editor to Super

packages/web/src/javascripts/Components/Popover/PositionedPopoverContent.tsx

@@ -33,6 +33,7 @@ const PositionedPopoverContent = ({
   hideOnClickInModal = false,
   setAnimationElement,
   containerClassName,
+  documentElement,
 }: PopoverContentProps) => {
   const [popoverElement, setPopoverElement] = useState<HTMLDivElement | null>(null)
   const popoverRect = useAutoElementRect(popoverElement)
@@ -45,13 +46,13 @@ const PositionedPopoverContent = ({
     y: anchorPoint?.y,
   })
   const anchorRect = anchorPoint ? anchorPointRect : anchorElementRect
-  const documentRect = useDocumentRect()
+  const _documentRect = useDocumentRect()
   const isDesktopScreen = useMediaQuery(MediaQueryBreakpoints.md)
 
   const styles = getPositionedPopoverStyles({
     align,
     anchorRect,
-    documentRect,
+    documentRect: documentElement?.getBoundingClientRect() ?? _documentRect,
     popoverRect: popoverRect ?? popoverElement?.getBoundingClientRect(),
     side,
     disableMobileFullscreenTakeover,
@@ -73,7 +74,7 @@ const PositionedPopoverContent = ({
   let adjustedStyles: PopoverCSSProperties | undefined = undefined
 
   if (!portal && popoverElement && styles) {
-    adjustedStyles = getAdjustedStylesForNonPortalPopover(popoverElement, styles)
+    adjustedStyles = getAdjustedStylesForNonPortalPopover(popoverElement, styles, documentElement)
   }
 
   usePopoverCloseOnClickOutside({

packages/web/src/javascripts/Components/Popover/Types.ts

@@ -50,6 +50,7 @@ type CommonPopoverProps = {
   offset?: number
   hideOnClickInModal?: boolean
   open: boolean
+  documentElement?: HTMLElement
 }
 
 export type PopoverContentProps = CommonPopoverProps & {

packages/web/src/javascripts/Components/Popover/Utils/getAdjustedStylesForNonPortal.ts

@@ -6,7 +6,7 @@ export const getAdjustedStylesForNonPortalPopover = (
   styles: PopoverCSSProperties,
   parent?: HTMLElement,
 ) => {
-  const absoluteParent = parent || getAbsolutePositionedParent(popoverElement)
+  const absoluteParent = parent || getAbsolutePositionedParent(popoverElement) || popoverElement.parentElement
   const translateXProperty = styles?.['--translate-x']
   const translateYProperty = styles?.['--translate-y']