import { createContext, useId } from 'react';

export const OverlayIdContext = createContext<string | undefined>(undefined);

export type OverlayIdProviderProps = {
  open: boolean;
  children?: React.ReactNode;
};

export const OverlayIdProvider = ({ open, children }: OverlayIdProviderProps) => {
  const id = useId();
  return (
    <OverlayIdContext.Provider value={open ? id : undefined}>{children}</OverlayIdContext.Provider>
  );
};