"use client"

import * as React from "react"

import {
  FLOATING_WINDOW_OVERLAY_Z_INDEX,
} from "../../lib/floating-window"

const FloatingWindowOverlayContext = React.createContext(false)

export function FloatingWindowOverlayProvider({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <FloatingWindowOverlayContext.Provider value={true}>
      {children}
    </FloatingWindowOverlayContext.Provider>
  )
}

export function useInsideFloatingWindowOverlay(): boolean {
  return React.useContext(FloatingWindowOverlayContext)
}

/** Radix portals on `document.body` sit at `z-50`; floating windows paint at 55. */
export function floatingWindowOverlayZClass(insideFloatingWindow: boolean): string {
  return insideFloatingWindow
    ? `z-[${FLOATING_WINDOW_OVERLAY_Z_INDEX}]`
    : "z-50"
}